<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2">
<meta name="theme-color" content="#222">
<meta name="generator" content="Hexo 5.4.0">
  <link rel="apple-touch-icon" sizes="180x180" href="/git-study/images/apple-touch-icon-next.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/git-study/images/favicon-32x32-next.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/git-study/images/favicon-16x16-next.png">
  <link rel="mask-icon" href="/git-study/images/logo.svg" color="#222">

<link rel="stylesheet" href="/git-study/css/main.css">


<link rel="stylesheet" href="/git-study/lib/font-awesome/css/all.min.css">
  <link rel="stylesheet" href="/git-study/lib/pace/pace-theme-minimal.min.css">
  <script src="/git-study/lib/pace/pace.min.js"></script>

<script id="hexo-configurations">
    var NexT = window.NexT || {};
    var CONFIG = {"hostname":"ma-ju-dong.gitee.io","root":"/git-study/","scheme":"Mist","version":"7.8.0","exturl":false,"sidebar":{"position":"left","display":"post","padding":18,"offset":12,"onmobile":false},"copycode":{"enable":false,"show_result":false,"style":null},"back2top":{"enable":true,"sidebar":false,"scrollpercent":false},"bookmark":{"enable":false,"color":"#222","save":"auto"},"fancybox":false,"mediumzoom":false,"lazyload":false,"pangu":false,"comments":{"style":"tabs","active":null,"storage":true,"lazyload":false,"nav":null},"algolia":{"hits":{"per_page":10},"labels":{"input_placeholder":"Search for Posts","hits_empty":"We didn't find any results for the search: ${query}","hits_stats":"${hits} results found in ${time} ms"}},"localsearch":{"enable":true,"trigger":"auto","top_n_per_article":1,"unescape":false,"preload":false},"motion":{"enable":true,"async":false,"transition":{"post_block":"fadeIn","post_header":"slideDownIn","post_body":"slideDownIn","coll_header":"slideLeftIn","sidebar":"slideUpIn"}},"path":"search.xml"};
  </script>

  <meta name="description" content="欢迎你的到来！">
<meta property="og:type" content="website">
<meta property="og:title" content="hexo-note">
<meta property="og:url" content="https://ma-ju-dong.gitee.io/index.html">
<meta property="og:site_name" content="hexo-note">
<meta property="og:description" content="欢迎你的到来！">
<meta property="og:locale" content="zh_CN">
<meta property="article:author" content="小洞洞">
<meta name="twitter:card" content="summary">

<link rel="canonical" href="https://ma-ju-dong.gitee.io/">


<script id="page-configurations">
  // https://hexo.io/docs/variables.html
  CONFIG.page = {
    sidebar: "",
    isHome : true,
    isPost : false,
    lang   : 'zh-CN'
  };
</script>

  <title>hexo-note</title>
  






  <noscript>
  <style>
  .use-motion .brand,
  .use-motion .menu-item,
  .sidebar-inner,
  .use-motion .post-block,
  .use-motion .pagination,
  .use-motion .comments,
  .use-motion .post-header,
  .use-motion .post-body,
  .use-motion .collection-header { opacity: initial; }

  .use-motion .site-title,
  .use-motion .site-subtitle {
    opacity: initial;
    top: initial;
  }

  .use-motion .logo-line-before i { left: initial; }
  .use-motion .logo-line-after i { right: initial; }
  </style>
</noscript>

</head>

<body itemscope itemtype="http://schema.org/WebPage">
  <div class="container use-motion">
    <div class="headband"></div>
    <a target="_blank" rel="noopener" href="https://your-url" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#64CEAA; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
    <header class="header" itemscope itemtype="http://schema.org/WPHeader">
      <div class="header-inner"><div class="site-brand-container">
  <div class="site-nav-toggle">
    <div class="toggle" aria-label="切换导航栏">
      <span class="toggle-line toggle-line-first"></span>
      <span class="toggle-line toggle-line-middle"></span>
      <span class="toggle-line toggle-line-last"></span>
    </div>
  </div>

  <div class="site-meta">

    <a href="/git-study/" class="brand" rel="start">
      <span class="logo-line-before"><i></i></span>
      <h1 class="site-title">hexo-note</h1>
      <span class="logo-line-after"><i></i></span>
    </a>
      <p class="site-subtitle" itemprop="description">www.mjd.cn</p>
  </div>

  <div class="site-nav-right">
    <div class="toggle popup-trigger">
        <i class="fa fa-search fa-fw fa-lg"></i>
    </div>
  </div>
</div>




<nav class="site-nav">
  <ul id="menu" class="main-menu menu">
        <li class="menu-item menu-item-home">

    <a href="/git-study/" rel="section"><i class="fa fa-home fa-fw"></i>首页</a>

  </li>
        <li class="menu-item menu-item-categories">

    <a href="/git-study/categories/" rel="section"><i class="fa fa-th fa-fw"></i>分类</a>

  </li>
        <li class="menu-item menu-item-archives">

    <a href="/git-study/archives/" rel="section"><i class="fa fa-archive fa-fw"></i>归档</a>

  </li>
      <li class="menu-item menu-item-search">
        <a role="button" class="popup-trigger"><i class="fa fa-search fa-fw"></i>搜索
        </a>
      </li>
  </ul>
</nav>



  <div class="search-pop-overlay">
    <div class="popup search-popup">
        <div class="search-header">
  <span class="search-icon">
    <i class="fa fa-search"></i>
  </span>
  <div class="search-input-container">
    <input autocomplete="off" autocapitalize="off"
           placeholder="搜索..." spellcheck="false"
           type="search" class="search-input">
  </div>
  <span class="popup-btn-close">
    <i class="fa fa-times-circle"></i>
  </span>
</div>
<div id="search-result">
  <div id="no-result">
    <i class="fa fa-spinner fa-pulse fa-5x fa-fw"></i>
  </div>
</div>

    </div>
  </div>

</div>
    </header>

    
  <div class="back-to-top">
    <i class="fa fa-arrow-up"></i>
    <span>0%</span>
  </div>


    <main class="main">
      <div class="main-inner">
        <div class="content-wrap">
          

          <div class="content index posts-expand">
            
      
  
  
  <article itemscope itemtype="http://schema.org/Article" class="post-block" lang="zh-CN">
    <link itemprop="mainEntityOfPage" href="https://ma-ju-dong.gitee.io/2021/10/21/scrapy/">

    <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
      <meta itemprop="image" content="https://img2.baidu.com/it/u=4224154811,71845300&fm=26&fmt=auto&gp=0.jpg">
      <meta itemprop="name" content="小洞洞">
      <meta itemprop="description" content="欢迎你的到来！">
    </span>

    <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="hexo-note">
    </span>
      <header class="post-header">
        <h2 class="post-title" itemprop="name headline">
          
            <a href="/git-study/2021/10/21/scrapy/" class="post-title-link" itemprop="url">scrapy</a>
        </h2>

        <div class="post-meta">
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="far fa-calendar"></i>
              </span>
              <span class="post-meta-item-text">发表于</span>

              <time title="创建时间：2021-10-21 22:27:12" itemprop="dateCreated datePublished" datetime="2021-10-21T22:27:12+08:00">2021-10-21</time>
            </span>
              <span class="post-meta-item">
                <span class="post-meta-item-icon">
                  <i class="far fa-calendar-check"></i>
                </span>
                <span class="post-meta-item-text">更新于</span>
                <time title="修改时间：2021-10-22 06:47:06" itemprop="dateModified" datetime="2021-10-22T06:47:06+08:00">2021-10-22</time>
              </span>
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="far fa-folder"></i>
              </span>
              <span class="post-meta-item-text">分类于</span>
                <span itemprop="about" itemscope itemtype="http://schema.org/Thing">
                  <a href="/git-study/categories/python/" itemprop="url" rel="index"><span itemprop="name">python</span></a>
                </span>
            </span>

          

        </div>
      </header>

    
    
    
    <div class="post-body" itemprop="articleBody">

      
          <h1 id="scrapy初学"><a href="#scrapy初学" class="headerlink" title="scrapy初学"></a>scrapy初学</h1><ul>
<li>新建项目<blockquote>
<p>scrapy startproject myspider  </p>
</blockquote>
</li>
<li>新建爬虫<blockquote>
<p>cd myspider<br>scrapy genspider itcast itcast.cn</p>
</blockquote>
</li>
<li>运行爬虫<blockquote>
<p>scrapy crawl itcast</p>
</blockquote>
</li>
</ul>
<h2 id="爬虫目录结构"><a href="#爬虫目录结构" class="headerlink" title="爬虫目录结构"></a>爬虫目录结构</h2><p><img src="image/1.png" alt="爬虫目录结构1"></p>
<h2 id="编码"><a href="#编码" class="headerlink" title="编码"></a>编码</h2><ul>
<li>进入spiders 下的 itcast.py<br>编写url、字段、解析（xpath）正则 等 在parse函数中使用 yield 返回 item  </li>
</ul>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">def</span> <span class="title">parse</span>(<span class="params">self, response</span>):</span></span><br><span class="line">       <span class="comment">#处理start url的响应</span></span><br><span class="line">       <span class="comment">#extract 提取文本  在text()中的   extracr_first() 提取第一项</span></span><br><span class="line">       ret1=response.xpath(<span class="string">&#x27;//*[@id=&quot;list&quot;]//a/text()&#x27;</span>).extract()</span><br><span class="line">       </span><br><span class="line">       <span class="keyword">for</span> i <span class="keyword">in</span> ret1:</span><br><span class="line">           item=&#123;&#125;</span><br><span class="line">           item[<span class="string">&#x27;page&#x27;</span>]=i</span><br><span class="line">           <span class="comment">#logging.waring(item)</span></span><br><span class="line">           <span class="comment">#logger.warning(item) #可以显示 打印的文件所在位置</span></span><br><span class="line">           <span class="comment">#2021-10-21 21:58:00 [myspider.spiders.itcast] WARNING: &#123;&#x27;page&#x27;: &#x27;第一四五四章 离开&#x27;&#125;</span></span><br><span class="line">           <span class="keyword">yield</span> item</span><br><span class="line">           </span><br></pre></td></tr></table></figure>
<ul>
<li>进入pipelines.py中 编写接收item<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">MyspiderPipeline</span>:</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">process_item</span>(<span class="params">self, item, spider</span>):</span></span><br><span class="line">        printf(item)</span><br><span class="line">        <span class="keyword">return</span> item</span><br></pre></td></tr></table></figure></li>
<li>进入seetings.py中添加<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">LOG_FILE = <span class="string">&quot;./LOG.log&quot;</span></span><br><span class="line">LOG_LEVEL =<span class="string">&quot;WARNING&quot;</span></span><br><span class="line">```   </span><br><span class="line">LOG_FILE 是日志文件 由自己编写路径  </span><br><span class="line">LOG_LEVEL 是日志等级 这里是警告</span><br><span class="line"></span><br><span class="line">同时取消如下注释 ：</span><br><span class="line">```python</span><br><span class="line">ITEM_PIPELINES = &#123;</span><br><span class="line">   <span class="string">&#x27;myspider.pipelines.MyspiderPipeline&#x27;</span>: <span class="number">300</span>,</span><br><span class="line">  </span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure></li>
<li>编写完以后就可以run了</li>
</ul>
<h2 id="其他项目日志自定义格式"><a href="#其他项目日志自定义格式" class="headerlink" title="其他项目日志自定义格式"></a>其他项目日志自定义格式</h2><p>自由选择路径 新建my_log.py:</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">import</span> logging</span><br><span class="line">logging.basicConfig(</span><br><span class="line">    <span class="comment"># 日志级别</span></span><br><span class="line">    level = logging.INFO,</span><br><span class="line">    <span class="comment"># 日志格式</span></span><br><span class="line">    <span class="comment"># 时间、代码所在文件名、代码行号、日志级别名字、日志信息</span></span><br><span class="line">    <span class="built_in">format</span> = <span class="string">&#x27;%(asctime)s %(filename)s[line:%(lineno)d] %(levelname)s %(message)s&#x27;</span>,</span><br><span class="line">    <span class="comment"># 打印日志的时间</span></span><br><span class="line">    datefmt = <span class="string">&#x27;%a, %d %b %Y %H:%M:%S&#x27;</span>,</span><br><span class="line">    <span class="comment"># 日志文件存放的目录（目录必须存在）及日志文件名</span></span><br><span class="line">    filename = <span class="string">&#x27;d:/report.log&#x27;</span>,</span><br><span class="line">    <span class="comment"># 打开日志文件的方式</span></span><br><span class="line">    filemode = <span class="string">&#x27;w&#x27;</span></span><br><span class="line">)</span><br></pre></td></tr></table></figure>
<ul>
<li>其他文件引用<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">from</span> my_log <span class="keyword">import</span> logging</span><br><span class="line"></span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">MyspiderPipeline</span>:</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">process_item</span>(<span class="params">self, item, spider</span>):</span></span><br><span class="line">        <span class="keyword">if</span> spider.name==<span class="string">&quot;itcast&quot;</span>:</span><br><span class="line">            item[<span class="string">&#x27;hello&#x27;</span>]=<span class="string">&quot;world&quot;</span></span><br><span class="line">            logging.warning(item)</span><br><span class="line">            <span class="keyword">return</span> item</span><br></pre></td></tr></table></figure></li>
</ul>

      
    </div>

    
    
    
      <footer class="post-footer">
        <div class="post-eof"></div>
      </footer>
  </article>
  
  
  

      
  
  
  <article itemscope itemtype="http://schema.org/Article" class="post-block" lang="zh-CN">
    <link itemprop="mainEntityOfPage" href="https://ma-ju-dong.gitee.io/2021/09/14/wx-drf/">

    <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
      <meta itemprop="image" content="https://img2.baidu.com/it/u=4224154811,71845300&fm=26&fmt=auto&gp=0.jpg">
      <meta itemprop="name" content="小洞洞">
      <meta itemprop="description" content="欢迎你的到来！">
    </span>

    <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="hexo-note">
    </span>
      <header class="post-header">
        <h2 class="post-title" itemprop="name headline">
          
            <a href="/git-study/2021/09/14/wx-drf/" class="post-title-link" itemprop="url">wx+drf</a>
        </h2>

        <div class="post-meta">
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="far fa-calendar"></i>
              </span>
              <span class="post-meta-item-text">发表于</span>

              <time title="创建时间：2021-09-14 21:42:10" itemprop="dateCreated datePublished" datetime="2021-09-14T21:42:10+08:00">2021-09-14</time>
            </span>
              <span class="post-meta-item">
                <span class="post-meta-item-icon">
                  <i class="far fa-calendar-check"></i>
                </span>
                <span class="post-meta-item-text">更新于</span>
                <time title="修改时间：2021-10-22 06:46:53" itemprop="dateModified" datetime="2021-10-22T06:46:53+08:00">2021-10-22</time>
              </span>
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="far fa-folder"></i>
              </span>
              <span class="post-meta-item-text">分类于</span>
                <span itemprop="about" itemscope itemtype="http://schema.org/Thing">
                  <a href="/git-study/categories/python/" itemprop="url" rel="index"><span itemprop="name">python</span></a>
                </span>
            </span>

          

        </div>
      </header>

    
    
    
    <div class="post-body" itemprop="articleBody">

      
          <h1 id="跳转"><a href="#跳转" class="headerlink" title="跳转"></a>跳转</h1><h2 id="对标签绑定点击事件"><a href="#对标签绑定点击事件" class="headerlink" title="对标签绑定点击事件"></a>对标签绑定点击事件</h2><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;view class=&quot;item&quot; bindtap=&quot;onclick&quot; data-nid=&quot;123&quot;&gt;</span><br></pre></td></tr></table></figure>
<p>其中bindtap为点击事件，onclick为点击后js执行的函数，使用data-参数名 来传参;</p>
<h2 id="js响应函数"><a href="#js响应函数" class="headerlink" title="js响应函数"></a>js响应函数</h2><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">onclick:function(e)&#123;</span><br><span class="line">    var nid=e.currentTarget.dataset.nid;</span><br><span class="line">  console.log(nid);</span><br><span class="line">  &#125;</span><br></pre></td></tr></table></figure>
<p>其中e为一个对象，可以通过下层的currentTarget下的dataset就可以找到需要传递的参数</p>
<p>e的层次代码图如下所示:<br><img src="./%E4%BB%A3%E7%A0%81%E6%88%AA%E5%9B%BE/e%E4%BA%8B%E4%BB%B6.png" alt="image"></p>
<h2 id="页面跳转"><a href="#页面跳转" class="headerlink" title="页面跳转"></a>页面跳转</h2><p>只需要在响应函数内添加如下代码，另外需要注意跳转页面不能是设置过tabbar的页面:</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">wx.navigateTo(&#123;</span><br><span class="line">     url: &#x27;/pages/redired/redired&#x27;,</span><br><span class="line">   &#125;)</span><br></pre></td></tr></table></figure>
<p>如果需要用到拼接的方式获取页面路径则可以使用如下方式:</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">wx.navigateTo(&#123;</span><br><span class="line">    url: &#x27;/pages/redired/redired?id=&#x27;+nid,</span><br><span class="line">  &#125;)</span><br></pre></td></tr></table></figure>

<p>页面跳转可以接受参数，在跳转到的页面中的onload函数中接受</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">/**</span><br><span class="line"> * 生命周期函数--监听页面加载</span><br><span class="line"> */</span><br><span class="line">onLoad: function (options) &#123;</span><br><span class="line">  console.log(options);</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>

<p>通过标签跳转</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;navigator url=&quot;/pages/redired/redired?id=666&quot;&gt;跳转到新页面&lt;/navigator&gt;</span><br></pre></td></tr></table></figure>
<p>#数据绑定<br>前端中vue.js的绑定格式</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">&lt;div id=&quot;app&quot;&gt;</span><br><span class="line">  &lt;p&gt; &#123;&#123; counter &#125;&#125;&lt;/p&gt;</span><br><span class="line">&lt;/div&gt;</span><br><span class="line"></span><br><span class="line">&lt;script&gt;</span><br><span class="line">    new Vue(&#123;</span><br><span class="line">        el: &#x27;#app&#x27;,</span><br><span class="line">        data: &#123;</span><br><span class="line">            counter: 0</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;)</span><br><span class="line">&lt;/script&gt;</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<p>微信的数据绑定和前端一样，如下面例子</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">&lt;view&gt;数据：&#123;&#123;message&#125;&#125;&lt;/view&gt;</span><br><span class="line"></span><br><span class="line">/**</span><br><span class="line">* 页面的初始数据</span><br><span class="line">*/</span><br><span class="line">data: &#123;</span><br><span class="line">message:&quot;这里是数据双向绑定&quot;</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>
<p>通过函数获取data中的message,this指当前的page</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">ChangeData:function()&#123;</span><br><span class="line">    console.log(this.data.message);</span><br><span class="line">  &#125;,</span><br></pre></td></tr></table></figure>
<p>修改数据：使用setData函数</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">ChangeData:function()&#123;</span><br><span class="line">  //获取数据</span><br><span class="line">  console.log(this.data.message);</span><br><span class="line">  //修改数据（错误，这里改变后端的值）</span><br><span class="line">  //this.data.message=&quot;这里是message&quot;</span><br><span class="line">  this.setData(&#123;message:&quot;修改成功数据&quot;&#125;)</span><br><span class="line">  console.log(this.data.message);</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>
<h1 id="获取用户信息"><a href="#获取用户信息" class="headerlink" title="获取用户信息"></a>获取用户信息</h1><p>如果只是展示用户头像昵称，可以使用 <open-data /> 组件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">&lt;open-data type=&quot;userAvatarUrl&quot;&gt;&lt;/open-data&gt;</span><br><span class="line">&lt;open-data type=&quot;userNickName&quot;&gt;&lt;/open-data&gt;</span><br></pre></td></tr></table></figure>
<p>需要使用 button 来授权登录 </p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">&lt;button wx:if=&quot;&#123;&#123;canIUse&#125;&#125;&quot; open-type=&quot;getUserInfo&quot; bindgetuserinfo=&quot;bindGetUserInfo&quot;&gt;授权登录&lt;/button&gt;</span><br><span class="line">&lt;view wx:else&gt;请升级微信版本&lt;/view&gt;</span><br></pre></td></tr></table></figure>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br></pre></td><td class="code"><pre><span class="line">Page(&#123;</span><br><span class="line">  data: &#123;</span><br><span class="line">    canIUse: wx.canIUse(&#x27;button.open-type.getUserInfo&#x27;)</span><br><span class="line">  &#125;,</span><br><span class="line">  onLoad: function() &#123;</span><br><span class="line">    // 查看是否授权</span><br><span class="line">    wx.getSetting(&#123;</span><br><span class="line">      success (res)&#123;</span><br><span class="line">        if (res.authSetting[&#x27;scope.userInfo&#x27;]) &#123;</span><br><span class="line">          // 已经授权，可以直接调用 getUserInfo 获取头像昵称</span><br><span class="line">          wx.getUserInfo(&#123;</span><br><span class="line">            success: function(res) &#123;</span><br><span class="line">              console.log(res.userInfo)</span><br><span class="line">            &#125;</span><br><span class="line">          &#125;)</span><br><span class="line">        &#125;</span><br><span class="line">      &#125;</span><br><span class="line">    &#125;)</span><br><span class="line">  &#125;,</span><br><span class="line">  bindGetUserInfo (e) &#123;</span><br><span class="line">    console.log(e.detail.userInfo)//获取具体信息使用字典[&#x27;key&#x27;]</span><br><span class="line">  &#125;</span><br><span class="line">&#125;)</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<h1 id="获取定位信息"><a href="#获取定位信息" class="headerlink" title="获取定位信息"></a>获取定位信息</h1><p>这里的 that=this 是将page引入到该函数中，不然下面的函数中的this不是指向page。 </p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">getLocalPath:function()&#123;</span><br><span class="line">  var that=this</span><br><span class="line">  wx.chooseLocation(&#123;</span><br><span class="line">    success:function(res)&#123;</span><br><span class="line">    console.log(res.address)</span><br><span class="line">    that.setData(&#123;localpath:res.address&#125;)</span><br><span class="line">    &#125;</span><br><span class="line">  &#125;)</span><br><span class="line">&#125;,</span><br></pre></td></tr></table></figure>
<h1 id="for指令"><a href="#for指令" class="headerlink" title="for指令"></a>for指令</h1><p>####循环的是列表</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">&lt;text&gt;商品列表&lt;/text&gt;</span><br><span class="line">&lt;view&gt;</span><br><span class="line">  &lt;view wx:for=&quot;&#123;&#123;datalist&#125;&#125;&quot;&gt;&#123;&#123;index&#125;&#125;-&#123;&#123;item&#125;&#125;&lt;/view&gt;</span><br><span class="line">&lt;/view&gt;</span><br></pre></td></tr></table></figure>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">data: &#123;</span><br><span class="line">   datalist:[&#x27;袜子&#x27;,&#x27;鞋子&#x27;,&#x27;衣服&#x27;,&#x27;华为&#x27;,&#x27;小米&#x27;]</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<p>其中item和index是死的，不能乱改，但是可以采用下面的形式来修改</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">&lt;text&gt;商品列表&lt;/text&gt;</span><br><span class="line">&lt;view&gt;</span><br><span class="line">  &lt;view wx:for=&quot;&#123;&#123;datalist&#125;&#125;&quot; wx:for-index=&quot;idx&quot; wx:for-item=&quot;x&quot;&gt;&#123;&#123;idx&#125;&#125;-&#123;&#123;x&#125;&#125;&lt;/view&gt;</span><br><span class="line">&lt;/view&gt;</span><br></pre></td></tr></table></figure>
<p>####循环的是字典</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">&lt;view&gt;用户信息(循环字典)&lt;/view&gt;</span><br><span class="line"></span><br><span class="line">&lt;view&gt;</span><br><span class="line">&lt;view&gt;&#123;&#123;userinfo.name&#125;&#125;&lt;/view&gt;</span><br><span class="line">&lt;view&gt;&#123;&#123;userinfo.age&#125;&#125;&lt;/view&gt;</span><br><span class="line">&lt;/view&gt;</span><br><span class="line"></span><br><span class="line">&lt;view wx:for=&quot;&#123;&#123;userinfo&#125;&#125;&quot;&gt;&#123;&#123;index&#125;&#125;-&#123;&#123;item&#125;&#125;&lt;/view&gt;</span><br></pre></td></tr></table></figure>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">data: &#123;</span><br><span class="line">   datalist:[&#x27;袜子&#x27;,&#x27;鞋子&#x27;,&#x27;衣服&#x27;,&#x27;华为&#x27;,&#x27;小米&#x27;],</span><br><span class="line">   userinfo:&#123;</span><br><span class="line">     name:&#x27;小青&#x27;,</span><br><span class="line">     age:&#x27;19&#x27;</span><br><span class="line">   &#125;</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<h1 id="上传图片"><a href="#上传图片" class="headerlink" title="上传图片"></a>上传图片</h1><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">&lt;text bindtap=&quot;upLoadImage&quot;&gt;请上传头像&lt;/text&gt;</span><br><span class="line">&lt;view&gt;</span><br><span class="line">&lt;image wx:for=&quot;&#123;&#123;piclist&#125;&#125;&quot; src=&quot;&#123;&#123;item&#125;&#125;&quot;&gt;&lt;/image&gt;</span><br><span class="line">&lt;/view&gt;</span><br></pre></td></tr></table></figure>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br></pre></td><td class="code"><pre><span class="line">data: &#123;</span><br><span class="line">   piclist:[&#x27;../image/head.jpg&#x27;,&#x27;../image/算法图.jpg&#x27;]</span><br><span class="line"> &#125;,</span><br><span class="line"> upLoadImage:function()&#123; </span><br><span class="line">   var that=this</span><br><span class="line">   wx.chooseImage(&#123;</span><br><span class="line">     count:9,//最多选择9张图片</span><br><span class="line">     sizeType:[&#x27;original&#x27;, &#x27;compressed&#x27;],//原图；压缩图</span><br><span class="line">     sourceType:[&#x27;album&#x27;, &#x27;camera&#x27;],//选择相册和相机</span><br><span class="line"></span><br><span class="line">     success:function(res)&#123;//成功后</span><br><span class="line">       console.log(res)</span><br><span class="line">       that.setData(&#123;piclist: res.tempFilePaths&#125;)</span><br><span class="line">     &#125;,</span><br><span class="line"></span><br><span class="line">     fail:function(res)&#123;//失败后</span><br><span class="line">     &#125;,</span><br><span class="line">     complete:function(res)&#123;//无论成功失败都执行</span><br><span class="line"></span><br><span class="line">     &#125;</span><br><span class="line">   &#125;);</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<p>上传图片追加的方式</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">success:function(res)&#123;//成功后</span><br><span class="line">  var newlist=that.data.piclist.concat(res.tempFilePaths);//concat将两个列表合并，但是不改变原来列表的值，他们重新复制给新的列表</span><br><span class="line">  that.setData(&#123;piclist:newlist&#125;)</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<h1 id="数据绑定（双向绑定）"><a href="#数据绑定（双向绑定）" class="headerlink" title="数据绑定（双向绑定）"></a>数据绑定（双向绑定）</h1><h2 id="input的双向绑定"><a href="#input的双向绑定" class="headerlink" title="input的双向绑定"></a>input的双向绑定</h2><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">&lt;text&gt;你输入了：&#123;&#123;message&#125;&#125;&lt;/text&gt;</span><br><span class="line">&lt;input value=&quot;&#123;&#123;message&#125;&#125;&quot; bindinput=&quot;bindText&quot;&gt;&lt;/input&gt;</span><br></pre></td></tr></table></figure>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">data: &#123;</span><br><span class="line">   message:&quot;你好&quot;</span><br><span class="line"> &#125;,</span><br><span class="line"> bindText:function(e)&#123;</span><br><span class="line">   console.log(e.detail.value)</span><br><span class="line">   this.setData(&#123;message:e.detail.value&#125;)</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<h2 id="登录（前后端）"><a href="#登录（前后端）" class="headerlink" title="登录（前后端）"></a>登录（前后端）</h2><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">&lt;text&gt;手机号&lt;/text&gt;</span><br><span class="line">&lt;input value=&quot;&#123;&#123;phone&#125;&#125;&quot; bindinput=&quot;bindText&quot; placeholder=&quot;请输入手机号&quot;&gt;&lt;/input&gt;</span><br><span class="line">&lt;text&gt;验证码: &lt;text&gt;点击获取验证码&lt;/text&gt;&lt;/text&gt;</span><br><span class="line">&lt;input value=&quot;&#123;&#123;code&#125;&#125;&quot; bindinput=&quot;bindCode&quot; placeholder=&quot;请输入验证码&quot;&gt;&lt;/input&gt;</span><br><span class="line"></span><br><span class="line">&lt;button bindtap=&quot;login&quot;&gt;登录&lt;/button&gt;</span><br></pre></td></tr></table></figure>
<p>js请求部分</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br></pre></td><td class="code"><pre><span class="line">data: &#123;</span><br><span class="line">   phone:&quot;&quot;,</span><br><span class="line">   code:&#x27;&#x27;,</span><br><span class="line"> &#125;,</span><br><span class="line"> /*获取并且设置输入的phone*/ </span><br><span class="line"> bindText:function(e)&#123;</span><br><span class="line">   console.log(e.detail.value)</span><br><span class="line">   this.setData(&#123;phone:e.detail.value&#125;)</span><br><span class="line"> &#125;,</span><br><span class="line"> /**获取并且设置code */</span><br><span class="line"> bindCode:function(e)&#123;</span><br><span class="line">   console.log(e.detail.value)</span><br><span class="line">   this.setData(&#123;code:e.detail.value&#125;)</span><br><span class="line"> &#125;,</span><br><span class="line"> /**登录 */</span><br><span class="line"> login:function()&#123;</span><br><span class="line">   console.log(this.data.phone,this.data.code)</span><br><span class="line">   /**将手机号和验证码发送到后端，后端进行登录 */</span><br><span class="line">  wx.request(&#123;</span><br><span class="line">    url: &#x27;http://127.0.0.1:8000/app01/login/&#x27;,</span><br><span class="line">    data: &#123;phone:this.data.phone,code:this.data.code&#125;,</span><br><span class="line">    method: &#x27;POST&#x27;,</span><br><span class="line">    success: (result) =&gt; &#123;console.log(result);&#125;,</span><br><span class="line">     </span><br><span class="line">  &#125;)</span><br><span class="line"> &#125;,</span><br></pre></td></tr></table></figure>
<p>在使用 wx.request等网络请求的时候，需要遵循：</p>
<ul>
<li>网络地址为https</li>
<li>后台必须设置需要访问的域名</li>
</ul>
<h3 id="后端api设置"><a href="#后端api设置" class="headerlink" title="后端api设置"></a>后端api设置</h3><ul>
<li>新建django项目</li>
<li>路由分发urls  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">from django.contrib import admin</span><br><span class="line">from django.urls import path,include</span><br><span class="line">urlpatterns = [</span><br><span class="line">    path(&#x27;admin/&#x27;, admin.site.urls),</span><br><span class="line">    path(&#x27;app01/&#x27;,include(&#x27;app01.urls&#x27;))</span><br><span class="line">]</span><br><span class="line"></span><br><span class="line">```  </span><br><span class="line"></span><br><span class="line">* 新建app01</span><br><span class="line">* cbv实现简单返回  </span><br></pre></td></tr></table></figure>
from django.shortcuts import render,HttpResponse,redirect<br>from rest_framework.views import APIView<br>from rest_framework.response import Response</li>
</ul>
<p>class LoginView(APIView):<br>    def post(self,request,*args,**kwargs):<br>        print(request.data)<br>        return Response({‘status’:True})<br>    def get(self,request):<br>        print(request.data)<br>        return Response({“status”:201})  </p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">* 在app01新建urls.py</span><br></pre></td></tr></table></figure>
<p>from django.contrib import admin<br>from django.urls import path,include<br>from app01 import views<br>urlpatterns = [</p>
<pre><code>path(&#39;login/&#39;,views.LoginView.as_view())
</code></pre>
<p>]</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">* 实验连接</span><br><span class="line"></span><br><span class="line">### 手机号格式验证</span><br><span class="line">使用toast和re</span><br></pre></td></tr></table></figure>
<p> if(this.data.phone.length!=11){<br>      wx.showToast({<br>        title: ‘手机号长度错误’,<br>        icon:”none”/<em>loading success none error 支持插图片</em>/<br>      })<br>      return;<br>    }<br>  //正则匹配手机格式<br>    var reg=/^(1[3|4|7|8|9]\d(9)$)/;<br>   if( !reg.test(this.data.phone)){<br>     wx.showToast({<br>       title: ‘手机号格式错误’,<br>       icon:”none”<br>     })<br>     return;<br>   }</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">### 验证手机号 </span><br><span class="line">正则 序列化 cbv redis 腾讯云短信验证</span><br></pre></td></tr></table></figure>
<p>from django.shortcuts import render,HttpResponse,redirect<br>from rest_framework.views import APIView<br>from rest_framework.response import Response<br>from rest_framework import serializers<br>from rest_framework.exceptions import ValidationError<br>import re</p>
<p>def phone_validator(value):</p>
<pre><code>if not re.match(r&#39;^1[3|4|5|7|8][0-9]&#123;9&#125;$&#39;,value):
    raise ValidationError(&#39;手机格式错误&#39;)
</code></pre>
<p>class MessageSerializer(serializers.Serializer):<br>    phone=serializers.CharField(label=”手机号”,validators=[phone_validator,])</p>
<p>class MessageView(APIView):<br>    def get(self,request,*args,**kwargs):<br>        #1.获取手机号<br>        #2.手机格式校验  序列化<br>        ser=MessageSerializer(data=request.query_params)<br>        if not ser.is_valid():<br>            return Response({“status”:False,’message’:’手机号格式错误’})<br>        phone=ser.validated_data.get(‘phone’)<br>        #3.生成随机验证码<br>        import random<br>        random_code=random.randint(1000,9999)<br>        #4.发送到手机上,购买服务器发送短信，阿里云/腾讯云<br>        ‘’’<br>        注册腾讯云开通短信服务<br>        创建应用<br>            sdk appid:1400555798<br>        申请签名 使用公众号<br>        签名管理 id 名称<br>        申请模板 id 名称<br>        申请腾讯云的appid secrect key<br>        调用相关接口去发送短信 sdk 写好相关<br>        ‘’’<br>        #TODO tencent.send_message.get(phone,random_code)<br>        #5.校验验证码和手机号保留起来，超时时间为（30s过期）<br>        # 5.1 搭建redis服务器<br>        #5.2 diango中安装方便使用redis的模块django-redis<br>            #配置：setting.py<br>        ‘’’<br>        import redis<br>        pool=redis.ConnectionPool(host=’127.0.0.1’,port=8000)<br>        conn=redis.Redis(connection_pool=pool)<br>        conn.set(phone,random_code,ex=30)<br>       ‘’’<br>        from django_redis import get_redis_connection<br>        coon=get_redis_connection()<br>        coon.set(phone,random_code,ex=30)</p>
<pre><code>    # redis coon.set(&#39;19187495242&#39;,&#39;1675&#39;,ex=30)
    #conn=conn.get(&#39;19187495242&#39;)

    return Response(&#123;&quot;status&quot;:True,&#39;message&#39;:&#39;发送成功&#39;&#125;)
</code></pre>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">### 使用邮箱了</span><br><span class="line">* redis</span><br><span class="line">  在settings.py中</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<p>  CACHES = {<br>    “default”: {<br>        “BACKEND”: “django_redis.cache.RedisCache”,<br>        “LOCATION”: “redis://127.0.0.1:6379”,<br>        “OPTIONS”: {<br>            “CLIENT_CLASS”: “django_redis.client.DefaultClient”,<br>            “CONNECTION_POOL_KWARGS”: {“max_connections”: 100}<br>            # “PASSWORD”: “密码”,<br>        }<br>    }<br>}</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line">  </span><br><span class="line">###  启动redis  </span><br><span class="line"></span><br><span class="line"> 去找f盘的redis</span><br><span class="line"> redis-server redis.windows.conf</span><br><span class="line"></span><br><span class="line"> ![](./代码截图/redis启动.png)</span><br><span class="line"></span><br><span class="line">https://www.cnblogs.com/yunqing/p/10605934.html  </span><br><span class="line"></span><br><span class="line">然后使用：剩下使用邮箱代替上面部分即可</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">## QQ邮箱设置</span><br><span class="line"></span><br><span class="line">stteings.py</span><br></pre></td></tr></table></figure>
<p>EMAIL_BACKEND = ‘django.core.mail.backends.smtp.EmailBackend’<br>EMAIL_HOST = ‘smtp.qq.com’  # 腾讯QQ邮箱 SMTP 服务器地址<br>EMAIL_PORT = 25  # SMTP服务的端口号<br>EMAIL_HOST_USER = ‘<a href="mailto:&#x32;&#48;&#x38;&#x36;&#x33;&#51;&#52;&#52;&#x35;&#64;&#113;&#x71;&#46;&#x63;&#111;&#x6d;">&#x32;&#48;&#x38;&#x36;&#x33;&#51;&#52;&#52;&#x35;&#64;&#113;&#x71;&#46;&#x63;&#111;&#x6d;</a>‘  # 你的qq邮箱，邮件发送者的邮箱<br>EMAIL_HOST_PASSWORD = ‘slbsatkpmlmqcbbe’  # 你申请的授权码（略）<br>EMAIL_USE_TLS = False  # 与SMTP服务器通信时,是否启用安全模式</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">调用：</span><br></pre></td></tr></table></figure>
<p>from django.core.mail import send_mail</p>
<p>subject = ‘爱读书’  # 主题<br>from_email = settings.EMAIL_HOST_USER  # 发件人，在settings.py中已经配置<br>to_email = qqemail  # 邮件接收者列表</p>
<h1 id="发送的消息"><a href="#发送的消息" class="headerlink" title="发送的消息"></a>发送的消息</h1><p>message = f’你本次的验证码:{random_code}，有效时间为30秒’  # 发送普通的消息使用的时候message</p>
<p>send_mail(subject, message, from_email, [to_email],<br>          fail_silently=False, auth_user=None, auth_password=None,<br>          connection=None, html_message=None)</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">### 验证登录</span><br><span class="line">* 序列化器</span><br></pre></td></tr></table></figure>
<p>  class LoginSerializer(serializers.Serializer):  # 对用户提交数据校验<br>    code = serializers.CharField(label=”qq验证码”, )<br>    qqemail = serializers.CharField(label=”qq邮箱”, validators=[qqemail_validator, ])</p>
<pre><code>def validate_code(self,value):

    if len(value) != 4:
        raise ValidationError(&#39;短信格式错误&#39;)

    if not value.isdecimal():
        raise ValidationError(&#39;短信格式错误&#39;)

    qqemail = self.initial_data.get(&#39;qqemail&#39;)
    coon = get_redis_connection()
    code = coon.get(qqemail)

    if not code:
        raise ValidationError(&#39;验证码过期&#39;)

    if value != code.decode(&#39;utf-8&#39;):
        raise ValidationError(&#39;验证码错误&#39;)
    print(value)
    return value
</code></pre>
  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* POST处理</span><br></pre></td></tr></table></figure>
<p>class LoginView(APIView):<br>    def post(self, request, *args, **kwargs):<br>        # 校验QQ号是否违法<br>        # 校验验证码<br>        # 1.无验证码<br>        # 2有验证码<br>        # 3.输入错误<br>        # 去数据库中获取用户信息（获取创建）<br>        # 将一些信息范湖小程序<br>        ser = LoginSerializer(data=request.data)<br>        print(request.data)<br>        print(ser.is_valid())<br>        # 成功<br>        if ser.is_valid():<br>            pass<br>        else:<br>            return Response({‘status’: False, ‘message’: ‘验证错误’})<br>        qqemail = ser.validated_data.get(‘qqemail’)<br>        user_object, flag = models.UserInfo.objects.get_or_create(qqemail=qqemail)<br>        user_object.token = str(uuid.uuid4())<br>        user_object.save()<br>        return Response({‘status’: True, ‘data’: {‘token’: user_object.token, ‘qqemail’: qqemail}}, )</p>
<pre><code>def get(self, request):
    print(request.data)
    return Response(&#123;&quot;status&quot;: 201&#125;)
</code></pre>
  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* 小程序发送请求</span><br></pre></td></tr></table></figure>
<pre><code>wx.request(&#123;
 url: &#39;http://127.0.0.1:8000/login/&#39;,
 data: &#123;qqemail: this.data.qqemail,code:this.data.code&#125;,
 method: &#39;POST&#39;,
 dataType:&#39;json&#39;,
 success: function(result)&#123;
      console.log(result.data)
      //登录成功
      //将qq号放到全局的位置
      //1.去公共的app。js中获取globalData
     
      app.globalData.qqemail=result.data.data.qqemail
      console.log(app.globalData.qqemail)
      if (result.data.status)&#123;
        //跳转到上一级页面
        var pages=getCurrentPages();
        var prepage=pages[pages.length-2]
       
      /*wx.navigateTo(&#123;
        url: prepage,
      &#125;)*/
      wx.navigateBack(&#123;&#125;);
       &#125;
      //登录失败
      else&#123;
        wx.showToast(&#123;
          title: &#39;登录失败&#39;,
          icon:&quot;none&quot;
        &#125;)
      &#125; 
    
    &#125;,
 
</code></pre>
<p>   })<br>  },<br>  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">  * 全局变量</span><br><span class="line">首先在app.js中gloableData声明变量</span><br><span class="line">然后其他的页面调用：</span><br><span class="line">&gt; var app=getApp()</span><br><span class="line">&gt; app.gloableData.xxx</span><br><span class="line">  </span><br><span class="line">* 返回上页面</span><br></pre></td></tr></table></figure><br>   wx.navigateBack({});</p>
  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* 接口请求qq昵称头像</span><br></pre></td></tr></table></figure>
<p>   var qq=this.data.qqemail<br>    var qqnum=(qq+’’).replace(‘@qq.com’,””)<br>    var url=’<a target="_blank" rel="noopener" href="http://q1.qlogo.cn/g?b=qq&amp;nk=xx&amp;s=100&#39;.replace(&#39;xx&#39;,qqnum)">http://q1.qlogo.cn/g?b=qq&amp;nk=xx&amp;s=100&#39;.replace(&#39;xx&#39;,qqnum)</a><br>    this.setData({head:url})<br>    console.log(this.data.head)<br>  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">  </span><br><span class="line"> * 昵称（有乱码）</span><br><span class="line"></span><br><span class="line">### 本地存储</span><br><span class="line">* 存储  </span><br><span class="line">  +  wx.setStorageSync(&#x27;UserInfo&#x27;,result);</span><br><span class="line">* 取值  </span><br><span class="line">  +  var userinfo=wx.getStorageSync(&#x27;UserInfo&#x27;);</span><br><span class="line">* 删除  </span><br><span class="line">  +  wx.removeStorageSync(&#x27;UserInfo&#x27;)</span><br><span class="line"></span><br><span class="line">## 发布--子页面向向父页面传值   </span><br><span class="line">  父页面</span><br></pre></td></tr></table></figure><br>  <view bindtap="getTopic"></view></p>
<p>   data: {<br>      topicText:”请选择话题”,<br>      topicid:null<br>  },<br>  //修改子页面传过来的值<br>   pagesetData:function(res){<br>    this.setData({topicText:res.title,topicid:res.id})<br>  },<br>  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">子页面</span><br></pre></td></tr></table></figure><br>   <view class='item' wx:for="" bindtap="choseTopic" data-xx=""><br>    <text> </text><br>    <text></text><br>  </view></p>
<p>  data: {<br>    topiclist:[{id:1,title:’#吴亦凡太垃圾了’,count:100},<br>      {id:2,title:’#金牌第二 ‘,count:100},<br>      {id:3,title:’#喜欢听歌’,count:100},<br>      {id:4,title:’#网易云了’,count:100}]<br>  },</p>
<pre><code>choseTopic:function(e)&#123;
var topicinfo=e.currentTarget.dataset.xx;
//将值传递给上一个页面
var pages=getCurrentPages();//获取当前页面
var prevPage=pages[pages.length-2]//获取上一页面的对象
prevPage.pagesetData(topicinfo)
wx.navigateBack(&#123;&#125;),
console.log(topicinfo)
</code></pre>
<p>  },<br>  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">## 腾讯云的对象存储oss</span><br><span class="line">SecretId: AKIDd5HCrGQt76oFQL0SeZEcjbDYcQxEExOa </span><br><span class="line">SecretKey: wby5vUmnZ4IFvKSItCEzSfbFcjYWEfqj</span><br><span class="line">APPID:1306812331</span><br><span class="line"></span><br><span class="line">首先登陆腾讯云</span><br><span class="line">然后选择对象存储</span><br><span class="line">然后选择产看小程序sdk</span><br><span class="line">然后在按照文档说明</span><br><span class="line">使用的时候推荐方案一</span><br><span class="line">通过后端回去秘钥返回</span><br><span class="line"></span><br><span class="line">代码：</span><br><span class="line">* wx：</span><br></pre></td></tr></table></figure><br>  upload:function(){<br>    //方法1<br>    // var cos = new COS({<br>    //   SecretId: ‘AKIDd5HCrGQt76oFQL0SeZEcjbDYcQxEExOa’,<br>    //   SecretKey: ‘wby5vUmnZ4IFvKSItCEzSfbFcjYWEfqj’,<br>    // });</p>
<pre><code>//方法2 获取临时秘钥
var cos = new COS(&#123;
  // 必选参数
  getAuthorization: function (options, callback) &#123;
      // 服务端 JS 和 PHP 示例：https://github.com/tencentyun/cos-js-sdk-v5/blob/master/server/
      // 服务端其他语言参考 COS STS SDK ：https://github.com/tencentyun/qcloud-cos-sts-sdk
      // STS 详细文档指引看：https://cloud.tencent.com/document/product/436/14048
      wx.request(&#123;
          url: &#39;http://127.0.0.1:8000/credential/&#39;,
          data: &#123;
              // 可从 options 取需要的参数
          &#125;,
          success: function (result) &#123;
              var data = result.data;
              var credentials = data &amp;&amp; data.credentials;
              if (!data || !credentials) return console.error(&#39;credentials invalid&#39;);
              callback(&#123;
                  TmpSecretId: credentials.tmpSecretId,
                  TmpSecretKey: credentials.tmpSecretKey,
                  XCosSecurityToken: credentials.sessionToken,
                  // 建议返回服务器时间作为签名的开始时间，避免用户浏览器本地时间偏差过大导致签名错误
                  StartTime: data.startTime, // 时间戳，单位秒，如：1580000000
                  ExpiredTime: data.expiredTime, // 时间戳，单位秒，如：1580000900
              &#125;);
          &#125;
      &#125;);
  &#125;
&#125;);
console.log(this.data.piclist);
for (var index in this.data.piclist)&#123;
  var filePath=this.data.piclist[index]//获取本地上传图片路径
  // 先选择文件，得到临时路径

  cos.postObject(&#123;
  Bucket: &#39;mini-1306812331&#39;,
  Region: &#39;ap-chengdu&#39;,
  Key:index+&#39;x1.png&#39;,
  FilePath: filePath,
  onProgress: function (info) &#123;
      console.log(&#39;进度条&#39;,JSON.stringify(info));

  &#125;
</code></pre>
<p>  }, function (err, data) {</p>
<pre><code>  console.log(err || data);
</code></pre>
<p>  });<br>    }</p>
<p>  },<br>  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* 后端</span><br></pre></td></tr></table></figure><br>  class Credential(APIView):</p>
<pre><code>def get(self,request,*args,**kwargs):
    from django.conf import settings
    config = &#123;
        &#39;url&#39;: &#39;https://sts.tencentcloudapi.com/&#39;,
        # 域名，非必须，默认为 sts.tencentcloudapi.com
        &#39;domain&#39;: &#39;sts.tencentcloudapi.com&#39;,
        # 临时密钥有效时长，单位是秒
        &#39;duration_seconds&#39;: 1800,
        &#39;secret_id&#39;: &#39;AKIDd5HCrGQt76oFQL0SeZEcjbDYcQxEExOa&#39;,
        # 固定密钥
        &#39;secret_key&#39;: &#39;wby5vUmnZ4IFvKSItCEzSfbFcjYWEfqj&#39;,
        # 换成你的 bucket
        &#39;bucket&#39;: &#39;mini-1306812331&#39;,
        # 换成 bucket 所在地区
        &#39;region&#39;: &#39;ap-chengdu&#39;,
        # 这里改成允许的路径前缀，可以根据自己网站的用户登录态判断允许上传的具体路径
        # 例子： a.jpg 或者 a/* 或者 * (使用通配符*存在重大安全风险, 请谨慎评估使用)
        &#39;allow_prefix&#39;: &#39;*&#39;,
        # 密钥的权限列表。简单上传和分片需要以下的权限，其他权限列表请看 https://cloud.tencent.com/document/product/436/31923
        &#39;allow_actions&#39;: [
            &#39;name/cos:PostObject&#39;,
            --------相关权限-------------

        ],

    &#125;
    sts=Sts(config)
    response=sts.get_credential()
    return Response(response)
</code></pre>
  <figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br></pre></td><td class="code"><pre><span class="line">### 发布问题</span><br><span class="line">方式1.</span><br><span class="line">打开图片进行本地预览</span><br><span class="line">输入文字以及相应的信息</span><br><span class="line">点击发布按钮</span><br><span class="line">  * 将本地的图片上传到腾讯云对象存储中cos 并将cos中的地址返回。</span><br><span class="line">  * 将cos中的url和文字等信息一起提交到后台</span><br><span class="line">  * 可能拿不到cos中的图片  </span><br><span class="line">  </span><br><span class="line">在发送请求的时候是异步的，不会阻塞</span><br><span class="line"></span><br><span class="line">方式2.（推荐）</span><br><span class="line">打开图片进行本地浏览</span><br><span class="line">将本地图片上传到cos</span><br><span class="line">输入文字，选择信息</span><br><span class="line">发不完以后才可以点击按钮</span><br><span class="line"></span><br><span class="line">### 进度条组件</span><br><span class="line">这里显示上传图片的进度条为例</span><br></pre></td></tr></table></figure>
<p><progress percent="20" ></progress><br><view>进度：20%</view><br><progress percent="20" color="#dc1239"></progress></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">### 修改data的局部数据</span><br></pre></td></tr></table></figure>
<p> data: {<br>    persent:20,<br>    piclist:[<br>      {id:1,title:’图片1’,percent:20},<br>      {id:2,title:’图片2’,percent:40},<br>      {id:3,title:’图片3’,percent:70},<br>    ]<br>  },<br>  change:function(){<br>    /<em>方式1 数据多了就很慢<br>    var datalist=this.data.piclist<br>    datalist[0].percent=80<br>    this.setData({piclist:datalist})</em>/</p>
<pre><code>/*方式2 推荐*/
var num=2 
this.setData(&#123;[&#39;piclist[0].percent&#39;]:90,
[&#39;piclist[1].percent&#39;]:90,
[&#39;piclist[&#39;+num+&#39;].percent&#39;]:90&#125;)//字符串拼接
</code></pre>
<p>  },</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">### 闭包</span><br><span class="line">可以解决异步index问题，如进度条</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">## api封装</span><br><span class="line">新建文件夹config/api.js和page同级别</span><br></pre></td></tr></table></figure>
<p>var indexUrl=”<a href="http://127.0.0.1:8000&quot;">http://127.0.0.1:8000&quot;</a><br>module.exports={<br>getnews:indexUrl+”/getnews”,<br>}</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">* 引入</span><br><span class="line">  &gt; var api=(&#x27;../../config/api.js&#x27;)</span><br><span class="line"></span><br><span class="line">## 发布</span><br><span class="line"></span><br><span class="line">小程序：</span><br></pre></td></tr></table></figure>

<!--编辑区-->
<textarea name="sd" id="" cols="30" rows="10" placeholder="请输入你的talk"></textarea>
<view class="tu">
<!--上传图片区-->
<view class="pic" wx:for="">
  <image class="picm" src=""></image>
  
<p>  <view class="delete-btn" ><image  data-index="" catchtap="deleteImg" src="../image/delete.png"></image></view><br>  <progress class="progress" percent=""></progress><br></view></p>
<!--上传图片按钮-->
<p><image bindtap="upLoadImage" class="uppic" src="../image/uppicture.png"></image><br></view></p>
<!--标签-->
<view class="label">
<view class="label1" bindtap="getTopic"><image src="../image/place (2).png"></image> <view class="text"></view></view>
<view class="label1" bindtap="getLocalPath"><image src="../image/place (1).png" ></image> <view class="text"></view></view>
</view>



<p><view class="line"></view></p>
<view class="fabu">
  <button bindtap="upload" class="but">发表</button>
</view>


<view class="bac">
  <view>每天开心一点点</view>
</view>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">js逻辑</span><br><span class="line"></span><br><span class="line">data</span><br></pre></td></tr></table></figure>
 topicText:"添加标签",
    localpath:"添加地点",
    sublocalpath:"添加地点",//截取后的位置信息
    piclist:[],//上传下载使用
    urls:[],//图片地址

<pre><code>imgs:[],//渲染使用
progress:0,

qqemail:null,
qqname:null,
head:&#39;../image/head.jpg&#39;,
UserInfo:&#39;&#39;,

body:null,
</code></pre>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">获取话题</span><br></pre></td></tr></table></figure>
<p>getTopic:function(){<br>    wx.navigateTo({<br>      url: ‘/pages/topic/topic’,<br>    })<br>  },<br>pagesetData:function(res){<br>    this.setData({topicText:res.title,topicid:res.id})<br>},</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">获取定位</span><br></pre></td></tr></table></figure>
<p>getLocalPath:function(){<br>    console.log(“1”)<br>    var that=this<br>    wx.chooseLocation({<br>      success:function(res){<br>      console.log(res.address)<br>      that.setData({localpath:res.address,sublocalpath:res.address.substring(0,4)+”…”,localpath:res.address})<br>      }<br>    })<br>  },</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">删除图片</span><br></pre></td></tr></table></figure>
<p> //删除图片<br>  deleteImg: function (e) {<br>    //删除本地<br>    var that=this<br>    var imgs = that.data.piclist;<br>    var index = e.currentTarget.dataset.index;<br>    imgs.splice(index, 1);<br>    that.setData({<br>     piclist: imgs<br>    });<br>    //删除对象存储<br>    cos.deleteObject({<br>      Bucket: ‘mini-1306812331’,<br>      Region: ‘ap-chengdu’,<br>      Key: that.data.imgs[index].key,</p>
<pre><code>&#125;, function (err, data) &#123;
  console.log(err || data); 
&#125;);
var url = cos.getObjectUrl(&#123;
  Bucket: &#39;mini-1306812331&#39;,
  Region: &#39;ap-chengdu&#39;,
  Key: that.data.imgs[index].key,
  
</code></pre>
<p>   });<br>   console.log(‘url=’,url)<br>   },</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">获取日期</span><br></pre></td></tr></table></figure>
<p> onLoad: function (options) {<br>    var myDate = new Date();<br>    var riqi=myDate.toLocaleDateString();  //获取日期<br>    console.log(riqi)<br>  },</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">选择本地图片并且上传到oss</span><br></pre></td></tr></table></figure>
<p> upLoadImage:function(){</p>
<pre><code>var that=this
var imgs = this.data.imgs;

wx.chooseImage(&#123;
  count:9,//最多选择9张图片
  sizeType:[&#39;original&#39;, &#39;compressed&#39;],//原图；压缩图
  sourceType:[&#39;album&#39;, &#39;camera&#39;],//选择相册和相机

  success:function(res)&#123;//成功后
    var oldlength=that.data.piclist.length;
    // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
    let tempFilePaths = res.tempFilePaths;
    let totalcount=res.tempFilePaths.length+oldlength;//总照片数
    if(totalcount&gt;9)&#123;
      wx.showToast(&#123;
        title: &#39;图片最多选择9张&#39;,
        icon:&#39;none&#39;
      &#125;);
      return
    &#125;;

    var piclist=that.data.piclist.concat(res.tempFilePaths);//concat将两个列表合并，但是不改变原来列表的值，他///们重新复制给心得列表
    /**本地预览 */
    that.setData(&#123;piclist:piclist&#125;)
    //方法2 获取临时秘钥

console.log(that.data.piclist);
for (let index in res.tempFilePaths)&#123;

  var filePath=res.tempFilePaths[index]//http://tmp/t4TusS4AKmhG70b46dc9e64ad9aa477e1fff6cf646b7.jpg
  var filePathSplit=filePath.split(&#39;.&#39;);
  console.log(&quot;xxxxxxx&quot;,filePathSplit)//http://tmp/t4TusS4AKmhG70b46dc9e64ad9aa477e1fff6cf646b7
  var ext=filePathSplit[filePathSplit.length-1]
  console.log(&quot;ext=&quot;,ext)//jpg
  //创建随机字符串
  let randomString=Math.random().toString(36).slice(-8)+String(new Date().getDate())
  console.log(&quot;随机字符串&quot;,randomString)
  var filekey=randomString+&quot;.&quot;+ext;//自己组和的xxx.jpg

  //将新的名字复制给piclist[key]=filekey
  that.setData(&#123;
    [&#39;imgs[&#39;+oldlength+parseInt(index)+&#39;].key&#39;]:filekey&#125;)

  cos.postObject(&#123;
  Bucket: &#39;mini-1306812331&#39;,
  Region: &#39;ap-chengdu&#39;,
  Key:filekey,
  FilePath: filePath,
  onProgress: function (info) &#123;
    that.setData(&#123;
      [&#39;imgs[&#39;+oldlength+parseInt(index)+&#39;].percent&#39;]:info.percent*100
    &#125;)
    //如果进度条满了就可以删除
    if(imgs[index].percent==100)&#123;
      that.setData(&#123;
        [&#39;imgs[&#39;+oldlength+parseInt(index)+&#39;].delpic&#39;]:info.percent*100
      &#125;)
    &#125;
  &#125;
</code></pre>
<p>  }, function (err, data) {</p>
<pre><code>  console.log(err || data);
</code></pre>
<p>  });<br>    }</p>
<pre><code>  &#125;,
 
&#125;);
</code></pre>
<p>  },</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">细节处理</span><br><span class="line">css：</span><br><span class="line">使用 overflow: scroll;</span><br><span class="line">可以让图片隐藏滑动，适用于很多的图片</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">## api设计</span><br><span class="line"></span><br><span class="line">1.数据库设计</span><br><span class="line"></span><br><span class="line">* 话题</span><br></pre></td></tr></table></figure>
<p>class Topic(models.Model):<br>      topic=models.CharField(verbose_name=”话题”,max_length=32)<br>      hot=models.IntegerField(verbose_name=”热度”)</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* 动态</span><br></pre></td></tr></table></figure>

<p>class News(models.Model):<br>    “””<br>    动态<br>    “””<br>    cover = models.CharField(verbose_name=’封面’, max_length=128)<br>    content = models.CharField(verbose_name=’内容’, max_length=255)<br>    topic = models.ForeignKey(verbose_name=’话题’, to=’Topic’,on_delete=models.CASCADE, null=True, blank=True)<br>    address = models.CharField(verbose_name=’位置’, max_length=128, null=True, blank=True)</p>
<pre><code>user = models.ForeignKey(verbose_name=&#39;发布者&#39;, to=&#39;UserInfo&#39;, related_name=&#39;news&#39;,on_delete=models.CASCADE)

favor_count = models.PositiveIntegerField(verbose_name=&#39;赞数&#39;, default=0)
# favor = models.ManyToManyField(verbose_name=&#39;点赞记录&#39;, to=&#39;UserInfo&#39;, related_name=&quot;news_favor&quot;)

viewer_count = models.PositiveIntegerField(verbose_name=&#39;浏览数&#39;, default=0)
# viewer = models.ManyToManyField(verbose_name=&#39;浏览器记录&#39;, to=&#39;UserInfo&#39;, related_name=&#39;news_viewer&#39;)

comment_count = models.PositiveIntegerField(verbose_name=&#39;评论数&#39;, default=0)

create_date = models.DateTimeField(verbose_name=&#39;创建时间&#39;, auto_now_add=True)
</code></pre>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* 动态详细，外键为动态</span><br></pre></td></tr></table></figure>
<p>class NewsDetail(models.Model):<br>    “””<br>    动态详细<br>    “””<br>    key = models.CharField(verbose_name=’腾讯对象存储中的文件名’, max_length=128, help_text=”用于以后在腾讯对象存储中删除”)<br>    cos_path = models.CharField(verbose_name=’腾讯对象存储中图片路径’, max_length=128)<br>    news = models.ForeignKey(verbose_name=’动态’, to=’News’,on_delete=models.CASCADE)</p>
<pre><code>def __str__(self):
    return str([self.cos_path,self.key])
</code></pre>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">序列化</span><br><span class="line">这里涉及嵌套的反序列化，用于create</span><br><span class="line">使用外键的序列化，注意序列化内部使用序列化</span><br><span class="line"></span><br></pre></td></tr></table></figure>

<p>class CreateNewsTopicModelSerializer(serializers.Serializer):<br>    key = serializers.CharField()<br>    cos_path = serializers.CharField()</p>
<p>class CreateNewsModelSerializer(serializers.ModelSerializer):<br>    imageList = CreateNewsTopicModelSerializer(many=True)</p>
<pre><code>class Meta:
    model = models.News
    exclude = [&#39;user&#39;, &#39;viewer_count&#39;, &#39;comment_count&#39;]

def create(self, validated_data):
    image_list = validated_data.pop(&#39;imageList&#39;)
    news_object = models.News.objects.create(**validated_data)

    data_list = models.NewsDetail.objects.bulk_create(
        [models.NewsDetail(**info, news=news_object) for info in image_list]
    )
    news_object.imageList = data_list

    if news_object.topic:
        news_object.topic.hot += 1
        news_object.save()

    return news_object
</code></pre>
<p>class NewsDetailSer(serializers.Serializer):<br>    key = serializers.CharField()<br>    cos_path = serializers.CharField()</p>
<p>##获取news<br>class NewsSer(serializers.Serializer):<br>    cover =serializers.CharField()<br>    content =serializers.CharField()<br>    topic =TopicSer()<br>    address = serializers.CharField()<br>    user =serializers.StringRelatedField(read_only=True)<br>    favor_count =serializers.IntegerField()<br>    # favor = models.ManyToManyField(verbose_name=’点赞记录’, to=’UserInfo’, related_name=”news_favor”)</p>
<pre><code>viewer_count = serializers.IntegerField()
# viewer = models.ManyToManyField(verbose_name=&#39;浏览器记录&#39;, to=&#39;UserInfo&#39;, related_name=&#39;news_viewer&#39;)

comment_count = serializers.IntegerField()
create_date = serializers.DateTimeField()
newsdetail_set=serializers.StringRelatedField(read_only=True,many=True)
</code></pre>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">### 外键序列化  (重点)</span><br><span class="line">在序列化字段的是时候使用：  </span><br><span class="line">* 方式1    </span><br><span class="line">PrimaryKeyRelatedField()</span><br><span class="line">这里参数：only_read=True or queryset=...OBJ.all()  </span><br><span class="line">* 方式2  </span><br><span class="line">在模型类里面使用</span><br></pre></td></tr></table></figure>
<p> <strong>str</strong>()<br>序列化字段时：<br>StringRelatedFiled()</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">* 方式3  </span><br><span class="line">  在字段里使用序列化类</span><br><span class="line">    先定义一个序列化类，然后在序列化字段时使用</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<p>在一方中序列化另外有外键的一方（灰常好使，不要怕错）<br>使用小写类名_set=serlizers.PrimaryKeyRealetd(only=True,many=True)</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* views的设计</span><br></pre></td></tr></table></figure>
<p>class NewsView(CreateAPIView,ListAPIView):<br>    “”” 创建动态的API “””<br>    serializer_class = CreateNewsModelSerializer<br>    queryset = models.News.objects.all()<br>    def perform_create(self, serializer):<br>        new_object=serializer.save(user_id=1)<br>        return new_object</p>
<p>from .ser import NewsSer,NewsDetailSer<br>class GetNews(APIView):<br>    def get(self, request, *args, **kwargs):<br>        queryset = models.News.objects.all().order_by(“-id”)[0:10]<br>        ser = NewsSer(instance=queryset, many=True)<br>        return Response(ser.data)</p>
<p>class GetNewsDetail(APIView):<br>    def get(self, request, *args, **kwargs):<br>        queryset = models.NewsDetail.objects.all()<br>        ser = NewsDetailSer(instance=queryset, many=True)<br>        return Response(ser.data)</p>
<p>class GetNewsDetailOnly(APIView):<br>    def get(self, request,pk):<br>        queryset = models.NewsDetail.objects.filter(news_id=pk)<br>        ser = NewsDetailSer(instance=queryset, many=True)<br>        return Response(ser.data)</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">## 使用脚本对数据库进行初始化</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<p>import os<br>import sys<br>import django</p>
<p>base_dir=os.path.dirname(os.path.dirname(os.path.abspath(<strong>file</strong>)))<br>sys.path.append(base_dir)</p>
<p>os.environ.setdefault(“DJANGO_SETTINGS_MODULE”,”template.settings”)<br>django.setup()</p>
<p>#====================数据库初始化脚本======================<br>from app03 import models</p>
<p>for i in range(1,37):<br>    models.Topic.objects.create(<br>        topic=”今天很热”,hot=100<br>    )<br>    models.News.objects.create(<br>           cover=”<a target="_blank" rel="noopener" href="https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&quot;">https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&quot;</a>,<br>           content =”第{}只羊”.format(i),<br>           topic_id =i,<br>           address =”云南”,<br>           user_id =1,<br>        )<br>    models.NewsDetail.objects.create(<br>        key= ‘lme85byh23.jpg’,<br>        cos_path=’<a target="_blank" rel="noopener" href="https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&#39;">https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&#39;</a>,<br>        news_id=i<br>    )<br>    models.NewsDetail.objects.create(<br>        key=’lme85byh23.jpg’,<br>        cos_path=’<a target="_blank" rel="noopener" href="https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&#39;">https://mini-1306812331.cos.ap-chengdu.myqcloud.com/lme85byh23.jpg&#39;</a>,<br>        news_id=i<br>    )<br>    models.NewsDetail.objects.create(<br>        key=’jrpzjj8w16.jpg’,<br>        cos_path=’<a target="_blank" rel="noopener" href="https://mini-1306812331.cos.ap-chengdu.myqcloud.com/jrpzjj8w16.jpg">https://mini-1306812331.cos.ap-chengdu.myqcloud.com/jrpzjj8w16.jpg</a> ‘,<br>        news_id=i<br>    )</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">## 箭头函数</span><br><span class="line">可以不用将this转换成that</span><br><span class="line"></span><br><span class="line">## 上拉刷新--下拉刷新</span><br><span class="line">* js</span><br></pre></td></tr></table></figure>
<p>/**</p>
<ul>
<li>页面相关事件处理函数–监听用户下拉动作</li>
<li>/<br>onPullDownRefresh: function () {<br>var that=this<br>wx.request({<br>  //获取新闻列表<br>  url:’<a target="_blank" rel="noopener" href="http://127.0.0.1:8000/get1topic/&#39;">http://127.0.0.1:8000/get1topic/&#39;</a>,<br>  data:{<pre><code>maxid:that.data.maxid
</code></pre>
  },<br>  dataType:”json”,<br>  responseType:’text’,<br>  method: ‘GET’,<br>  success: (result) =&gt; {console.log(result.data)<br>   if(result.data.length){<pre><code> wx.showToast(&#123;
   title: &#39;已经是最新数据&#39;,
  
 &#125;)
</code></pre>
   }<br>   wx.stopPullDownRefresh({<pre><code> success: (res) =&gt; &#123;return&#125;,
 
</code></pre>
   })<pre><code> var newdata=result.data.reverse()//将数据反转
 that.setData(&#123;data:newdata.concat(that.data.data),maxid:newdata[0].id&#125;)
</code></pre>
  },<br>})<br>},</li>
</ul>
<p>  /**</p>
<ul>
<li>页面上拉触底事件的处理函数</li>
<li>/<br>onReachBottom: function () {<br>var that=this<br>wx.request({<br>  //获取新闻列表<br>  url:’<a target="_blank" rel="noopener" href="http://127.0.0.1:8000/get1topic/&#39;">http://127.0.0.1:8000/get1topic/&#39;</a>,<br>  data:{<pre><code>minid:that.data.minid
</code></pre>
  },<br>  dataType:”json”,<br>  responseType:’text’,<br>  method: ‘GET’,<br>  success: (result) =&gt; {console.log(result.data)<br>   if(result){<br>  that.setData({data:that.data.data.concat(result.data),minid:result.data[result.data.length-1].id})<br>   }<br>  },<br>})<br>},</li>
</ul>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">* json</span><br></pre></td></tr></table></figure>
<p>{<br>  “usingComponents”: {},<br>  “enablePullDownRefresh”: true<br>}</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">* api</span><br><span class="line">```python</span><br><span class="line">class GetNews(APIView):</span><br><span class="line">    def get(self, request, *args, **kwargs):</span><br><span class="line">        minid=request.query_params.get(&#x27;minid&#x27;)</span><br><span class="line">        maxid = request.query_params.get(&#x27;maxid&#x27;)</span><br><span class="line">        if not minid:</span><br><span class="line">            queryset = models.News.objects.all().order_by(&quot;-id&quot;)[0:10]</span><br><span class="line">        elif maxid:</span><br><span class="line">            queryset = models.News.objects.filter(id__gt=maxid).order_by(&quot;id&quot;)[0:10]</span><br><span class="line">        else:</span><br><span class="line">            queryset = models.News.objects.filter(id__lt=minid).order_by(&quot;-id&quot;)[0:10]</span><br><span class="line">        ser = NewsSer(instance=queryset, many=True)</span><br><span class="line">        return Response(ser.data)</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<ul>
<li>api优化<br>可以使用分页器和filterbackend来共同完成</li>
</ul>
<h2 id="注意"><a href="#注意" class="headerlink" title="注意"></a>注意</h2><p>数据库删除问题：<br>删除时必须将表django_migrations中的相关文件删除<br>这东西浪费了我很久时间！</p>
<h2 id="轮播图组件"><a href="#轮播图组件" class="headerlink" title="轮播图组件"></a>轮播图组件</h2><ul>
<li>js<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// components/theSwiper.js</span></span><br><span class="line">Component(&#123;</span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 组件的属性列表</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">properties</span>: &#123;</span><br><span class="line">    <span class="attr">imgUrls</span>: <span class="built_in">Array</span>,</span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 组件的初始数据</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">data</span>: &#123;</span><br><span class="line">    <span class="attr">currentIndex</span>: <span class="number">0</span></span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 组件的方法列表</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">methods</span>: &#123;</span><br><span class="line">    <span class="function"><span class="title">swiperChange</span>(<span class="params">e</span>)</span> &#123;</span><br><span class="line">      <span class="built_in">this</span>.setData(&#123;</span><br><span class="line">        <span class="attr">currentIndex</span>: e.detail.current</span><br><span class="line">      &#125;);</span><br><span class="line">    &#125;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;);</span><br><span class="line"><span class="comment">/*</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">&lt;view class=&quot;dots-box own-class&quot;&gt;</span></span><br><span class="line"><span class="comment">  &lt;view class=&quot;dots &#123;&#123;currentIndex == index ? &#x27;bg-333&#x27; : &#x27;&#x27;&#125;&#125;&quot; wx: for=&quot;&#123;&#123; imgUrls &#125;&#125;&quot; wx:key=&quot;&#123;&#123; index &#125;&#125;&quot;&gt;&lt;/view&gt;</span></span><br><span class="line"><span class="comment">&lt;/view &gt;</span></span><br><span class="line"><span class="comment">*/</span></span><br><span class="line"><span class="string">``</span><span class="string">`json</span></span><br><span class="line"><span class="string">json</span></span><br><span class="line"><span class="string"></span></span><br><span class="line"><span class="string">&#123;</span></span><br><span class="line"><span class="string">  &quot;component&quot;: true,</span></span><br><span class="line"><span class="string">  &quot;usingComponents&quot;: &#123;&#125;</span></span><br><span class="line"><span class="string">&#125;</span></span><br><span class="line"><span class="string"></span></span><br><span class="line"><span class="string">wxml</span></span><br><span class="line"><span class="string">`</span><span class="string">``</span>wxml</span><br><span class="line">&lt;swiper indicator-dots=<span class="string">&quot;false&quot;</span> </span><br><span class="line">        autoplay=<span class="string">&quot;&#123;&#123;true&#125;&#125;&quot;</span> </span><br><span class="line">        interval=<span class="string">&quot;5000&quot;</span> </span><br><span class="line">        indicator-dots=<span class="string">&quot;&#123;&#123;false&#125;&#125;&quot;</span> </span><br><span class="line">        indicator-color=<span class="string">&#x27;#8a8a8a&#x27;</span> </span><br><span class="line">        indicator-active-color=<span class="string">&#x27;#333&#x27;</span> </span><br><span class="line">        circular=<span class="string">&quot;true&quot;</span> </span><br><span class="line">        <span class="class"><span class="keyword">class</span></span>=<span class="string">&quot;swiper-block&quot;</span> </span><br><span class="line">        bindchange=<span class="string">&quot;swiperChange&quot;</span> </span><br><span class="line">        previous-margin=<span class="string">&quot;100rpx&quot;</span> </span><br><span class="line">        next-margin=<span class="string">&quot;100rpx&quot;</span> </span><br><span class="line">        current=<span class="string">&quot;&#123;&#123;0&#125;&#125;&quot;</span>&gt;</span><br><span class="line">  <span class="xml"><span class="tag">&lt;<span class="name">block</span> <span class="attr">wx:for</span>=<span class="string">&quot;&#123;&#123;imgUrls&#125;&#125;&quot;</span> <span class="attr">wx:index</span>=<span class="string">&quot;&#123;&#123;index&#125;&#125;&quot;</span> <span class="attr">wx:key</span>=<span class="string">&quot;&#123;&#123;index&#125;&#125;&quot;</span>&gt;</span></span></span><br><span class="line"><span class="xml">    <span class="tag">&lt;<span class="name">swiper-item</span> <span class="attr">class</span>=<span class="string">&quot;swiper-item &quot;</span>&gt;</span></span></span><br><span class="line"><span class="xml">      <span class="tag">&lt;<span class="name">image</span> <span class="attr">mode</span>=<span class="string">&quot;aspectFill&quot;</span> <span class="attr">src</span>=<span class="string">&quot;&#123;&#123;item&#125;&#125;&quot;</span> <span class="attr">class</span>=<span class="string">&quot;slide-image &#123;&#123;currentIndex == index ? &#x27;active&#x27; : &#x27;common&#x27;&#125;&#125;&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="xml">    <span class="tag">&lt;/<span class="name">swiper-item</span>&gt;</span></span></span><br><span class="line"><span class="xml">  <span class="tag">&lt;/<span class="name">block</span>&gt;</span></span></span><br><span class="line">&lt;/swiper&gt;</span><br><span class="line"></span><br></pre></td></tr></table></figure></li>
<li>wxss<figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br></pre></td><td class="code"><pre><span class="line">page&#123;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="number">#fff</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.swiper-block</span> &#123;</span><br><span class="line">  <span class="attribute">background</span>: <span class="number">#fff</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">500</span>rpx;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.swiper-item</span>&#123;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">flex-direction</span>: column;</span><br><span class="line">  <span class="attribute">justify-content</span>: start;</span><br><span class="line">  <span class="attribute">align-items</span>: flex-start;</span><br><span class="line">  <span class="attribute">overflow</span>: unset;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">550</span>rpx;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">450</span>rpx;</span><br><span class="line">  <span class="attribute">padding-top</span>: <span class="number">70</span>rpx;</span><br><span class="line">  <span class="attribute">padding-bottom</span>: <span class="number">20</span>rpx;</span><br><span class="line">  <span class="attribute">box-sizing</span>: border-box;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slide-image</span>&#123;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">300</span>rpx;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">450</span>rpx;</span><br><span class="line">  <span class="attribute">border-radius</span>: <span class="number">10</span>rpx;</span><br><span class="line">  <span class="attribute">margin</span>: <span class="number">0</span>rpx <span class="number">50</span>rpx ;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">1</span>;</span><br><span class="line">  <span class="attribute">box-shadow</span>: <span class="number">10</span>rpx <span class="number">5px</span> <span class="number">40</span>rpx <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>,<span class="number">0.5</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.active</span>&#123;</span><br><span class="line">  <span class="attribute">transform</span>: <span class="built_in">scale</span>(<span class="number">1.3</span>);</span><br><span class="line">  <span class="attribute">transition</span>: all .<span class="number">5s</span> ease-in <span class="number">0s</span>;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">20</span>;</span><br><span class="line">  <span class="attribute">opacity</span>: <span class="number">1</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.common</span>&#123;</span><br><span class="line">  <span class="attribute">transform</span>: <span class="built_in">scale</span>(<span class="number">1</span>);</span><br><span class="line">  <span class="attribute">transition</span>: all .<span class="number">5s</span> ease-in <span class="number">0s</span>;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">opacity</span>: <span class="number">0.4</span>;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.dots-box</span>&#123;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">justify-content</span>: center;</span><br><span class="line">  <span class="attribute">align-items</span>: center;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.dots</span>&#123;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">30</span>rpx;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">6</span>rpx;</span><br><span class="line">  <span class="attribute">margin</span>: <span class="number">0</span> <span class="number">4</span>rpx;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="number">#aaa</span>;</span><br><span class="line">  <span class="attribute">margin-top</span>: -<span class="number">80</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.bg-333</span>&#123;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="number">#333</span>;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure></li>
</ul>
<p>—————-如何使用？————————</p>
<p>使用界面的 wxml 添加</p>
<custom-swiper imgUrls="" /> 

<p>json<br>这里组件地址写自己放组件的地址就行</p>
<figure class="highlight json"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">&#123;</span><br><span class="line">  <span class="attr">&quot;usingComponents&quot;</span>: &#123;</span><br><span class="line">    <span class="attr">&quot;custom-swiper&quot;</span>: <span class="string">&quot;../../components/customSwiper/customSwiper&quot;</span></span><br><span class="line">  &#125;,</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>js中的data添加数据：</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">carouselImgUrls:[</span><br><span class="line">    <span class="string">&quot;https://wx1.sinaimg.cn/mw690/006cV2kkly1g90322akslj30on1hcjvf.jpg&quot;</span>,</span><br><span class="line">    <span class="string">&quot;https://wx2.sinaimg.cn/mw690/006cV2kkly1g9032310y9j30on1hcdkw.jpg&quot;</span>,</span><br><span class="line">    <span class="string">&quot;https://wx3.sinaimg.cn/mw690/006cV2kkly1g90323z18oj30on1hc77z.jpg&quot;</span>,</span><br><span class="line">    <span class="string">&quot;https://wx1.sinaimg.cn/mw690/006cV2kkly1g90324d2mrj30on1hcwic.jpg&quot;</span>,</span><br><span class="line">    <span class="string">&quot;https://wx3.sinaimg.cn/mw690/006cV2kkly1g903258itpj30on1hctby.jpg&quot;</span></span><br><span class="line">  ],</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<h3 id="将对象转换成字典"><a href="#将对象转换成字典" class="headerlink" title="将对象转换成字典"></a>将对象转换成字典</h3><blockquote>
<p>modle_to_dict()</p>
</blockquote>
<h2 id="评论功能"><a href="#评论功能" class="headerlink" title="评论功能"></a>评论功能</h2><ul>
<li><p>数据库设计</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="class"><span class="keyword">class</span>  <span class="title">CommentRecored</span>(<span class="params">models.Model</span>):</span></span><br><span class="line">    news=models.ForeignKey(verbose_name=<span class="string">&quot;动态&quot;</span>,to=<span class="string">&#x27;NewsDetail&#x27;</span>,on_delete=models.DO_NOTHING)</span><br><span class="line">    content=models.CharField(verbose_name=<span class="string">&#x27;评论内容&#x27;</span>,max_length=<span class="number">255</span>)</span><br><span class="line">    user=models.ForeignKey(verbose_name=<span class="string">&#x27;评论者&#x27;</span>,to=<span class="string">&#x27;UserInfo&#x27;</span>,on_delete=models.DO_NOTHING)</span><br><span class="line">    create_date=models.DateTimeField(verbose_name=<span class="string">&#x27;评论时间&#x27;</span>,auto_now_add=<span class="literal">True</span>)</span><br><span class="line"></span><br><span class="line">    reply=models.ForeignKey(verbose_name=<span class="string">&#x27;回复&#x27;</span>,to=<span class="string">&#x27;self&#x27;</span>,null=<span class="literal">True</span>,blank=<span class="literal">True</span>,related_name=<span class="string">&#x27;replys&#x27;</span>,on_delete=models.SET_NULL)</span><br><span class="line">    depth=models.PositiveIntegerField(verbose_name=<span class="string">&#x27;评论层级数&#x27;</span>,default=<span class="number">1</span>)</span><br><span class="line">    root=models.ForeignKey(verbose_name=<span class="string">&#x27;跟评论&#x27;</span>,to=<span class="string">&#x27;self&#x27;</span>,null=<span class="literal">True</span>,blank=<span class="literal">True</span>,related_name=<span class="string">&#x27;roots&#x27;</span>,on_delete=models.SET_NULL)</span><br><span class="line"></span><br><span class="line">    favor_count=models.PositiveIntegerField(verbose_name=<span class="string">&#x27;赞数&#x27;</span>,default=<span class="number">0</span>)</span><br><span class="line"></span><br></pre></td></tr></table></figure>
<p>里面不是递归，而是自相连<br>使用自相连的时候需要注意related——name需要填充  </p>
</li>
<li><p>序列化  </p>
<ul>
<li>获取相关新闻及其评论信息<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">#获取news</span></span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">NewsSer</span>(<span class="params">serializers.Serializer</span>):</span></span><br><span class="line">    <span class="built_in">id</span>=serializers.IntegerField()</span><br><span class="line">    cover =serializers.CharField()</span><br><span class="line">    content =serializers.CharField()</span><br><span class="line">    topic =TopicSer()</span><br><span class="line">    address = serializers.CharField()</span><br><span class="line">    user =serializers.StringRelatedField(read_only=<span class="literal">True</span>)</span><br><span class="line">    favor_count =serializers.IntegerField()</span><br><span class="line">    <span class="comment"># favor = models.ManyToManyField(verbose_name=&#x27;点赞记录&#x27;, to=&#x27;UserInfo&#x27;, related_name=&quot;news_favor&quot;)</span></span><br><span class="line"></span><br><span class="line">    viewer_count = serializers.IntegerField()</span><br><span class="line">    <span class="comment"># viewer = models.ManyToManyField(verbose_name=&#x27;浏览器记录&#x27;, to=&#x27;UserInfo&#x27;, related_name=&#x27;news_viewer&#x27;)</span></span><br><span class="line"></span><br><span class="line">    comment_count = serializers.IntegerField()</span><br><span class="line">    create_date = serializers.DateTimeField(<span class="built_in">format</span>=<span class="string">&quot;%Y-%m-%d&quot;</span>)</span><br><span class="line">    newsdetail_set=serializers.StringRelatedField(read_only=<span class="literal">True</span>,many=<span class="literal">True</span>)</span><br><span class="line"></span><br><span class="line">    comment=serializers.SerializerMethodField()</span><br><span class="line"></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">get_comment</span>(<span class="params">self,obj</span>):</span></span><br><span class="line">        <span class="comment">#一级评论</span></span><br><span class="line">        first_comment=models.CommentRecored.objects.<span class="built_in">filter</span>(news_id=obj.<span class="built_in">id</span>,depth=<span class="number">1</span>).order_by(<span class="string">&#x27;id&#x27;</span>)[<span class="number">0</span>:<span class="number">10</span>].values(</span><br><span class="line">            <span class="string">&#x27;id&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;content&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;user&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;create_date&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;favor_count&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;depth&#x27;</span></span><br><span class="line"></span><br><span class="line">        )</span><br><span class="line">        first_comment_id=[item[<span class="string">&#x27;id&#x27;</span>] <span class="keyword">for</span> item <span class="keyword">in</span> first_comment]</span><br><span class="line">        <span class="built_in">print</span>(first_comment_id)</span><br><span class="line">        <span class="comment">#二级评论</span></span><br><span class="line">        <span class="keyword">from</span> django.db.models <span class="keyword">import</span> Max <span class="comment">#获取二级评论最新的一条</span></span><br><span class="line">        <span class="comment">#使用一级id分组，查询最新的二级评论的id,即获取每条一级评论下的最新一条二级评论</span></span><br><span class="line">        result= models.CommentRecored.objects.<span class="built_in">filter</span>(depth=<span class="number">2</span>,reply_id__in=first_comment_id).values(<span class="string">&#x27;id&#x27;</span>).annotate(max_id=Max(<span class="string">&#x27;id&#x27;</span>))</span><br><span class="line">        second_id=[item[<span class="string">&#x27;max_id&#x27;</span>] <span class="keyword">for</span> item <span class="keyword">in</span> result]</span><br><span class="line">        <span class="built_in">print</span>(second_id)</span><br><span class="line">        second_comment = models.CommentRecored.objects.<span class="built_in">filter</span>(id__in=second_id).values(</span><br><span class="line">            <span class="string">&#x27;id&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;content&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;user__qqemail&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;create_date&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;reply_id&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;favor_count&#x27;</span>,</span><br><span class="line">            <span class="string">&#x27;depth&#x27;</span></span><br><span class="line"></span><br><span class="line">        )</span><br><span class="line">        <span class="built_in">print</span>(second_comment)</span><br><span class="line">        <span class="comment">##合并一二级评论在一个关键字里</span></span><br><span class="line">        <span class="comment">#使用字典</span></span><br><span class="line">        first_dict=&#123;&#125;</span><br><span class="line">        <span class="keyword">for</span> item <span class="keyword">in</span> first_comment:</span><br><span class="line">            item[<span class="string">&#x27;create_date&#x27;</span>]=item[<span class="string">&#x27;create_date&#x27;</span>].strftime(<span class="string">&#x27;%Y-%m-%d&#x27;</span>)<span class="comment">#2010-x-xx格式的日期</span></span><br><span class="line">            first_dict[item[<span class="string">&#x27;id&#x27;</span>]]=item</span><br><span class="line">        <span class="keyword">for</span> node <span class="keyword">in</span> second_comment:</span><br><span class="line">            node[<span class="string">&#x27;create_date&#x27;</span>] = node[<span class="string">&#x27;create_date&#x27;</span>].strftime(<span class="string">&#x27;%Y-%m-%d&#x27;</span>) <span class="comment"># 2010-x-xx格式的日期</span></span><br><span class="line">            first_dict[node[<span class="string">&#x27;reply_id&#x27;</span>]][<span class="string">&#x27;child&#x27;</span>]=[node,]</span><br><span class="line">        <span class="keyword">return</span>  <span class="built_in">list</span>(first_dict.values())</span><br></pre></td></tr></table></figure></li>
</ul>
</li>
<li><p>获取回复信息</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">  </span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">getcomment</span>(<span class="params">serializers.Serializer</span>):</span></span><br><span class="line">    <span class="built_in">id</span>=serializers.IntegerField()</span><br><span class="line">    content=serializers.CharField()</span><br><span class="line">    user__qqemail=serializers.CharField(source=<span class="string">&#x27;user.qqemail&#x27;</span>)</span><br><span class="line">    create_date=serializers.DateTimeField(<span class="built_in">format</span>=<span class="string">&quot;%Y-%m-%d&quot;</span>)</span><br><span class="line">    reply_id=serializers.IntegerField()</span><br><span class="line">    favor_count=serializers.IntegerField()</span><br><span class="line">    depth=serializers.IntegerField()</span><br></pre></td></tr></table></figure></li>
<li><p>创建回复信息</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">createfirstcomment</span>(<span class="params">serializers.ModelSerializer</span>):</span></span><br><span class="line">    <span class="class"><span class="keyword">class</span> <span class="title">Meta</span>:</span></span><br><span class="line">        model = models.CommentRecored</span><br><span class="line">        fields=<span class="string">&quot;__all__&quot;</span></span><br></pre></td></tr></table></figure></li>
<li><p>views</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"><span class="keyword">from</span> .ser <span class="keyword">import</span> NewsSer,NewsDetailSer,getcomment</span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">GetNews</span>(<span class="params">APIView</span>):</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">get</span>(<span class="params">self, request, *args, **kwargs</span>):</span></span><br><span class="line">        minid=request.query_params.get(<span class="string">&#x27;minid&#x27;</span>)</span><br><span class="line">        maxid = request.query_params.get(<span class="string">&#x27;maxid&#x27;</span>)</span><br><span class="line">        newid=request.query_params.get(<span class="string">&#x27;newid&#x27;</span>)</span><br><span class="line">        <span class="keyword">if</span>  minid:</span><br><span class="line">            queryset = models.News.objects.<span class="built_in">filter</span>(id__lt=minid).order_by(<span class="string">&quot;-id&quot;</span>)[<span class="number">0</span>:<span class="number">10</span>]</span><br><span class="line">        <span class="keyword">elif</span> maxid:</span><br><span class="line">            queryset = models.News.objects.<span class="built_in">filter</span>(id__gt=maxid).order_by(<span class="string">&quot;id&quot;</span>)[<span class="number">0</span>:<span class="number">10</span>]</span><br><span class="line"></span><br><span class="line">        <span class="keyword">elif</span> newid:</span><br><span class="line">            queryset = models.News.objects.<span class="built_in">filter</span>(<span class="built_in">id</span>=newid)</span><br><span class="line">            vc=queryset.values_list(<span class="string">&#x27;viewer_count&#x27;</span>)[<span class="number">0</span>][<span class="number">0</span>]</span><br><span class="line">            queryset.update(viewer_count=vc+<span class="number">1</span>)</span><br><span class="line"></span><br><span class="line">        <span class="keyword">else</span>:</span><br><span class="line">            queryset = models.News.objects.<span class="built_in">all</span>().order_by(<span class="string">&quot;-id&quot;</span>)[<span class="number">0</span>:<span class="number">10</span>]</span><br><span class="line">        ser = NewsSer(instance=queryset, many=<span class="literal">True</span>)</span><br><span class="line">        <span class="keyword">return</span> Response(ser.data)</span><br><span class="line"></span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">GetNewsDetail</span>(<span class="params">APIView</span>):</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">get</span>(<span class="params">self, request, *args, **kwargs</span>):</span></span><br><span class="line">        queryset = models.NewsDetail.objects.<span class="built_in">all</span>()</span><br><span class="line">        ser = NewsDetailSer(instance=queryset, many=<span class="literal">True</span>)</span><br><span class="line">        <span class="keyword">return</span> Response(ser.data)</span><br><span class="line"></span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">GetComment</span>(<span class="params">APIView</span>):</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">get</span>(<span class="params">self,requset,*args,**kwargs</span>):</span></span><br><span class="line">        itid=requset.GET.get(<span class="string">&#x27;itemid&#x27;</span>)</span><br><span class="line">        obj=models.CommentRecored.objects.<span class="built_in">filter</span>(reply_id=itid)</span><br><span class="line">        ser=getcomment(instance=obj,many=<span class="literal">True</span>)</span><br><span class="line"></span><br><span class="line">        <span class="keyword">return</span> Response(ser.data)</span><br><span class="line"><span class="keyword">from</span> .ser <span class="keyword">import</span> createfirstcomment</span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">CreateComment</span>(<span class="params">CreateAPIView</span>):</span></span><br><span class="line">    serializer_class = createfirstcomment</span><br><span class="line"></span><br></pre></td></tr></table></figure></li>
<li><h2 id="小程序端"><a href="#小程序端" class="headerlink" title="小程序端"></a>小程序端</h2></li>
<li><p>html</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">&lt;!--pages/newsdetail/newsdetail.wxml--&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="tag">&lt;<span class="name">custom-swiper</span> <span class="attr">wx:if</span>=<span class="string">&quot;&#123;&#123;carouselImgUrls.length&#125;&#125;&quot;</span> <span class="attr">imgUrls</span>=<span class="string">&quot;&#123;&#123;carouselImgUrls&#125;&#125;&quot;</span> /&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;user&quot;</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">image</span> <span class="attr">src</span>=<span class="string">&quot;../image/fabubac.jpg&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">image</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">text</span>&gt;</span>多啦的碑文<span class="tag">&lt;/<span class="name">text</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span>&gt;</span> &#123;&#123;data.content&#125;&#125;#&#123;&#123;data.topic.topic&#125;&#125;<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span>&gt;</span>浏览量：&#123;&#123;data.viewer_count&#125;&#125;<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="comment">&lt;!--虚线--&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;com&quot;</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;line&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">text</span>&gt;</span>评论<span class="tag">&lt;/<span class="name">text</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;line&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="comment">&lt;!--评论--&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;pinglun&quot;</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">view</span> <span class="attr">wx:for</span>=<span class="string">&quot;&#123;&#123;data.comment&#125;&#125;&quot;</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;first&quot;</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;head&quot;</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">image</span> <span class="attr">src</span>=<span class="string">&quot;../image/fabubac.jpg&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">image</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;sec&quot;</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">view</span> <span class="attr">style</span>=<span class="string">&quot;font-weight:600&quot;</span>&gt;</span>多啦的碑文<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;ba&quot;</span>&gt;</span>&#123;&#123;item.create_date&#125;&#125;<span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;back&quot;</span> <span class="attr">bindtap</span>=<span class="string">&quot;huifu&quot;</span> <span class="attr">data-uer</span>=<span class="string">&quot;多啦的碑文&quot;</span>  <span class="attr">data-replyid</span>=<span class="string">&quot;&#123;&#123;item.id&#125;&#125;&quot;</span>&gt;</span>回复<span class="tag">&lt;/<span class="name">view</span>&gt;</span><span class="tag">&lt;/<span class="name">view</span>&gt;</span> </span><br><span class="line">      <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;dianzan&quot;</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">image</span> <span class="attr">src</span>=<span class="string">&quot;../image/dianzan.png&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">image</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">text</span>&gt;</span>&#123;&#123;item.favor_count&#125;&#125;<span class="tag">&lt;/<span class="name">text</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;content&quot;</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;te&quot;</span>&gt;</span>&#123;&#123;item.content&#125;&#125;<span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;huifu&quot;</span> <span class="attr">bindtap</span>=<span class="string">&quot;hui&quot;</span> <span class="attr">data-itemid</span>=<span class="string">&quot;&#123;&#123;item.id&#125;&#125;&quot;</span> <span class="attr">data-idx</span>=<span class="string">&quot;&#123;&#123;index&#125;&#125;&quot;</span>&gt;</span>更多评论 &gt;<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;<span class="name">view</span> <span class="attr">wx:for</span>=<span class="string">&quot;&#123;&#123;item.child&#125;&#125;&quot;</span> <span class="attr">wx:for-item</span>=<span class="string">&quot;idxs&quot;</span>&gt;</span></span><br><span class="line">          <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;first&quot;</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;head&quot;</span>&gt;</span></span><br><span class="line">              <span class="tag">&lt;<span class="name">image</span> <span class="attr">src</span>=<span class="string">&quot;../image/fabubac.jpg&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">image</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;sec&quot;</span>&gt;</span></span><br><span class="line">              <span class="tag">&lt;<span class="name">view</span>&gt;</span>多啦的碑文<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">              <span class="tag">&lt;<span class="name">view</span>&gt;</span>&#123;&#123;idxs.create_date&#125;&#125;<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;dianzan&quot;</span>&gt;</span></span><br><span class="line">              <span class="tag">&lt;<span class="name">image</span> <span class="attr">src</span>=<span class="string">&quot;../image/dianzan.png&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">image</span>&gt;</span></span><br><span class="line">              <span class="tag">&lt;<span class="name">text</span>&gt;</span>&#123;&#123;idxs.favor_count&#125;&#125;<span class="tag">&lt;/<span class="name">text</span>&gt;</span></span><br><span class="line">            <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">          <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">          <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;te&quot;</span>&gt;</span>&#123;&#123;idxs.content&#125;&#125;<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">        <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">      <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;fpl&quot;</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">textarea</span> <span class="attr">placeholder</span>=<span class="string">&quot;&#123;&#123;tolk&#125;&#125;&quot;</span> <span class="attr">class</span>=<span class="string">&quot;texa&quot;</span> <span class="attr">bindinput</span>=<span class="string">&quot;textcont&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">textarea</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">button</span> <span class="attr">bindtap</span>=<span class="string">&quot;ok&quot;</span> <span class="attr">data-data</span>=<span class="string">&quot;&#123;&#123;data&#125;&#125;&quot;</span>&gt;</span>确认<span class="tag">&lt;/<span class="name">button</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br></pre></td></tr></table></figure></li>
<li><p>样式css</p>
<figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">/* pages/newsdetail/newsdetail.wxss */</span></span><br><span class="line"><span class="selector-class">.user</span>&#123;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">justify-content</span>: space-between;</span><br><span class="line">  <span class="attribute">align-items</span>: center;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">40%</span>;</span><br><span class="line">&#125;</span><br><span class="line">  image&#123;</span><br><span class="line">    <span class="attribute">float</span>: left;</span><br><span class="line">    <span class="attribute">margin-left</span>: <span class="number">10</span>rpx;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100</span>rpx;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100</span>rpx;</span><br><span class="line">    <span class="attribute">border-radius</span>: <span class="number">50%</span>;</span><br><span class="line">  &#125;</span><br><span class="line"><span class="selector-class">.com</span>&#123;</span><br><span class="line">  <span class="attribute">margin-top</span>: <span class="number">20</span>rpx;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">justify-content</span>: space-around;</span><br><span class="line">  <span class="attribute">align-items</span>: center;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.line</span>&#123;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">43%</span>;</span><br><span class="line">  <span class="attribute">border-bottom</span>: <span class="number">0.5</span>rpx dotted gray;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.first</span>&#123;</span><br><span class="line"><span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line"><span class="attribute">height</span>: <span class="number">80</span>rpx;</span><br><span class="line"></span><br><span class="line"><span class="attribute">margin-top</span>: <span class="number">25</span>rpx;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.head</span>&#123;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">80</span>rpx;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">80</span>rpx;</span><br><span class="line">  <span class="attribute">border-radius</span>: <span class="number">50%</span> ;</span><br><span class="line">  <span class="attribute">float</span>: left;</span><br><span class="line">  </span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.head</span> image&#123;</span><br><span class="line"><span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line"><span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.sec</span>&#123;</span><br><span class="line"><span class="attribute">float</span>: left;</span><br><span class="line"><span class="attribute">margin-left</span>: <span class="number">15</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.dianzan</span>&#123;</span><br><span class="line"> <span class="attribute">float</span>: right;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">15%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">80</span>rpx;</span><br><span class="line"> <span class="attribute">margin-right</span>: <span class="number">15</span>rpx;</span><br><span class="line">  </span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.dianzan</span> image&#123;</span><br><span class="line"></span><br><span class="line"> <span class="attribute">margin-top</span>: <span class="number">10</span>rpx;</span><br><span class="line"><span class="attribute">width</span>: <span class="number">50%</span>;</span><br><span class="line"><span class="attribute">height</span>: <span class="number">65%</span>;  </span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.dianzan</span> text&#123;</span><br><span class="line">  <span class="attribute">line-height</span>: <span class="number">80</span>rpx;</span><br><span class="line"> &#125;</span><br><span class="line"> <span class="selector-class">.content</span>&#123;</span><br><span class="line">   <span class="attribute">float</span>: none;</span><br><span class="line"> </span><br><span class="line">   <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">   <span class="attribute">margin-top</span>: <span class="number">5</span>rpx;</span><br><span class="line"> &#125;</span><br><span class="line"></span><br><span class="line"> <span class="selector-class">.te</span>&#123;</span><br><span class="line">   <span class="attribute">margin-top</span>: <span class="number">10</span>rpx;</span><br><span class="line">   <span class="attribute">background-color</span>: <span class="built_in">rgb</span>(<span class="number">236</span>, <span class="number">236</span>, <span class="number">236</span>);</span><br><span class="line">   <span class="attribute">white-space</span>:pre-wrap;</span><br><span class="line">   <span class="attribute">margin-left</span>: <span class="number">12%</span>;</span><br><span class="line"> &#125;</span><br><span class="line"> <span class="selector-class">.fpl</span>&#123;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">100</span>rpx;</span><br><span class="line">  <span class="attribute">position</span>: fixed;</span><br><span class="line">  <span class="attribute">bottom</span>: <span class="number">0</span>rpx;</span><br><span class="line"> <span class="attribute">border</span>: <span class="number">1</span>rpx sandybrown;</span><br><span class="line"> <span class="attribute">background-color</span>: <span class="built_in">rgb</span>(<span class="number">224</span>, <span class="number">224</span>, <span class="number">224</span>);</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">justify-content</span>: space-between;</span><br><span class="line">  <span class="attribute">flex-direction</span>: row;</span><br><span class="line"></span><br><span class="line"> &#125;</span><br><span class="line"><span class="selector-class">.fpl</span> <span class="selector-tag">textarea</span>&#123;</span><br><span class="line">  <span class="attribute">white-space</span>:pre-wrap ;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">70%</span>;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="number">#f5f6f8</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">80%</span>;</span><br><span class="line">  <span class="attribute">margin-left</span>: <span class="number">20</span>rpx;</span><br><span class="line">  <span class="attribute">border-radius</span>: <span class="number">5</span>rpx;</span><br><span class="line">  <span class="attribute">margin-top</span>: <span class="number">10</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.fpl</span> <span class="selector-tag">button</span>&#123;</span><br><span class="line"><span class="attribute">margin-top</span>: <span class="number">10</span>rpx;</span><br><span class="line"> <span class="attribute">line-height</span>: <span class="number">80</span>rpx;</span><br><span class="line">  <span class="attribute">width</span>:<span class="number">20%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">80%</span>;</span><br><span class="line">  <span class="attribute">float</span><span class="selector-pseudo">:right</span>;</span><br><span class="line">  <span class="attribute">right</span>: <span class="number">20</span>rpx;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="built_in">rgb</span>(<span class="number">235</span>, <span class="number">192</span>, <span class="number">144</span>);</span><br><span class="line">  <span class="attribute">border-radius</span>: <span class="number">8</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.pinglun</span>&#123;</span><br><span class="line"> </span><br><span class="line">  <span class="attribute">margin-bottom</span>:<span class="number">200</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.back</span>&#123;</span><br><span class="line">  <span class="attribute">float</span>: right;</span><br><span class="line">  <span class="attribute">font</span>: weight <span class="number">500</span>;</span><br><span class="line">  <span class="attribute">font-size</span>: <span class="number">30</span>rpx;</span><br><span class="line">&#125;</span><br><span class="line"></span><br></pre></td></tr></table></figure></li>
<li><p>js</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br><span class="line">153</span><br><span class="line">154</span><br><span class="line">155</span><br><span class="line">156</span><br><span class="line">157</span><br><span class="line">158</span><br><span class="line">159</span><br><span class="line">160</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// pages/newsdetail/newsdetail.js</span></span><br><span class="line">Page(&#123;</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 页面的初始数据</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">data</span>: &#123;</span><br><span class="line">    <span class="attr">carouselImgUrls</span>:<span class="literal">null</span>,</span><br><span class="line">    <span class="attr">data</span>:[],</span><br><span class="line">   </span><br><span class="line">    <span class="attr">head</span>:<span class="string">&#x27;../image/head.jpg&#x27;</span>,</span><br><span class="line">    <span class="attr">UserInfo</span>:<span class="string">&#x27;&#x27;</span>,</span><br><span class="line">    <span class="attr">ishuifu</span>:<span class="literal">true</span>,</span><br><span class="line">    <span class="attr">isfu</span>:<span class="literal">false</span>,</span><br><span class="line">    <span class="attr">option</span>:<span class="literal">null</span>,</span><br><span class="line"></span><br><span class="line">    <span class="attr">tolk</span>:<span class="string">&quot;留下点你来过的痕迹吧&quot;</span>,</span><br><span class="line"></span><br><span class="line">    <span class="comment">/*以下是发送的评论*/</span> </span><br><span class="line">    <span class="attr">textaea</span>:<span class="literal">null</span>,</span><br><span class="line">    <span class="attr">reply</span>:<span class="literal">null</span>,</span><br><span class="line">    <span class="attr">depth</span>:<span class="number">1</span>,</span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 生命周期函数--监听页面加载</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onLoad</span>: <span class="function"><span class="keyword">function</span> (<span class="params">options</span>) </span>&#123;</span><br><span class="line">   <span class="built_in">console</span>.log(<span class="string">&quot;optoions&quot;</span>,options)</span><br><span class="line">   <span class="built_in">this</span>.setData(&#123;<span class="attr">option</span>:options&#125;)</span><br><span class="line">    <span class="keyword">var</span> that=<span class="built_in">this</span></span><br><span class="line">    wx.request(&#123;</span><br><span class="line">      <span class="comment">//获取新闻列表</span></span><br><span class="line">      <span class="attr">url</span>:<span class="string">&#x27;http://127.0.0.1:8000/get1topic/&#x27;</span>,</span><br><span class="line">      <span class="attr">dataType</span>:<span class="string">&quot;json&quot;</span>,</span><br><span class="line">      <span class="attr">data</span>:&#123;</span><br><span class="line">        <span class="attr">newid</span>:options.newsid</span><br><span class="line">      &#125;,</span><br><span class="line">      <span class="attr">responseType</span>:<span class="string">&#x27;text&#x27;</span>,</span><br><span class="line">      <span class="attr">method</span>: <span class="string">&#x27;GET&#x27;</span>,</span><br><span class="line">      <span class="attr">success</span>: <span class="function">(<span class="params">result</span>) =&gt;</span> &#123;<span class="built_in">console</span>.log(<span class="string">&quot;result1data=&quot;</span>,result.data)</span><br><span class="line">       </span><br><span class="line">      that.setData(&#123;<span class="attr">data</span>:result.data[<span class="number">0</span>],<span class="attr">carouselImgUrls</span>:result.data[<span class="number">0</span>].newsdetail_set&#125;)</span><br><span class="line">     </span><br><span class="line">      <span class="built_in">console</span>.log(<span class="string">&quot;res====&gt;&quot;</span>,result.data[<span class="number">0</span>].newsdetail_set)</span><br><span class="line">      &#125;,</span><br><span class="line">     </span><br><span class="line">    &#125;)</span><br><span class="line"> </span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 生命周期函数--监听页面初次渲染完成</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onReady</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="attr">hui</span>:<span class="function"><span class="keyword">function</span>(<span class="params">e</span>)</span>&#123;</span><br><span class="line"></span><br><span class="line">  <span class="built_in">console</span>.log(<span class="string">&quot;data---&quot;</span>,<span class="built_in">this</span>.data.data)</span><br><span class="line">  <span class="keyword">var</span> that=<span class="built_in">this</span></span><br><span class="line">  <span class="comment">//console.log(this.data.data.comment[1].child[0])</span></span><br><span class="line">  <span class="keyword">var</span> itemid=e.currentTarget.dataset.itemid</span><br><span class="line">  <span class="keyword">var</span> idx=e.currentTarget.dataset.idx</span><br><span class="line">  <span class="built_in">console</span>.log(<span class="string">&quot;idex=&quot;</span>,idx)</span><br><span class="line">  <span class="built_in">console</span>.log(<span class="string">&quot;itemid=&quot;</span>,itemid)</span><br><span class="line">  wx.request(&#123;</span><br><span class="line">    <span class="attr">url</span>: <span class="string">&#x27;http://127.0.0.1:8000/getcom/?itemid=&#x27;</span>+itemid,</span><br><span class="line">    <span class="attr">dataType</span>:<span class="string">&#x27;json&#x27;</span>,</span><br><span class="line">    <span class="attr">method</span>: <span class="string">&#x27;GET&#x27;</span>,</span><br><span class="line">    <span class="attr">responseType</span>: <span class="string">&#x27;text&#x27;</span>,</span><br><span class="line">    <span class="attr">timeout</span>: <span class="number">0</span>,</span><br><span class="line">    <span class="attr">success</span>: <span class="function">(<span class="params">result</span>) =&gt;</span> &#123;<span class="built_in">console</span>.log(<span class="string">&#x27;result=&#x27;</span>,result)</span><br><span class="line">    that.setData(&#123;</span><br><span class="line">     [<span class="string">&#x27;data.comment[&#x27;</span>+idx+<span class="string">&#x27;].child&#x27;</span>]:result.data,<span class="attr">isfu</span>:<span class="literal">true</span></span><br><span class="line">    &#125;)</span><br><span class="line">    <span class="built_in">console</span>.log(<span class="string">&quot;childdata=&quot;</span>,<span class="built_in">this</span>.data.data)</span><br><span class="line">    &#125;,</span><br><span class="line">    </span><br><span class="line">  &#125;)</span><br><span class="line"> </span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 生命周期函数--监听页面显示</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onShow</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line"><span class="comment">/*评论内容*/</span> </span><br><span class="line"><span class="attr">textcont</span>:<span class="function"><span class="keyword">function</span>(<span class="params">e</span>)</span>&#123;</span><br><span class="line"><span class="built_in">console</span>.log(e.detail.value)</span><br><span class="line"><span class="built_in">this</span>.setData(&#123;<span class="attr">textaea</span>:e.detail.value&#125;)</span><br><span class="line">&#125;,</span><br><span class="line"><span class="attr">ok</span>:<span class="function"><span class="keyword">function</span>(<span class="params"></span>)</span>&#123;</span><br><span class="line">  <span class="keyword">var</span> that=<span class="built_in">this</span></span><br><span class="line">  <span class="built_in">console</span>.log(<span class="string">&quot;id=&quot;</span>,<span class="built_in">this</span>.data.data.id)</span><br><span class="line">  <span class="built_in">console</span>.log(that.data.reply)</span><br><span class="line">  wx.request(&#123;</span><br><span class="line">    <span class="comment">//获取新闻列表</span></span><br><span class="line">    <span class="attr">url</span>:<span class="string">&#x27;http://127.0.0.1:8000/upcomment/&#x27;</span>,</span><br><span class="line">    <span class="attr">dataType</span>:<span class="string">&quot;json&quot;</span>,</span><br><span class="line">    <span class="attr">data</span>:&#123;</span><br><span class="line">    </span><br><span class="line">      <span class="string">&quot;news&quot;</span>:that.data.data.id,</span><br><span class="line">      <span class="string">&quot;content&quot;</span>:that.data.textaea,</span><br><span class="line">      <span class="string">&quot;user&quot;</span>:<span class="number">1</span>,</span><br><span class="line">      <span class="string">&quot;depth&quot;</span>:that.data.depth,</span><br><span class="line">      <span class="string">&quot;reply&quot;</span>:that.data.reply</span><br><span class="line">    &#125;,</span><br><span class="line">    <span class="attr">responseType</span>:<span class="string">&#x27;text&#x27;</span>,</span><br><span class="line">    <span class="attr">method</span>: <span class="string">&#x27;POST&#x27;</span>,</span><br><span class="line">    <span class="attr">success</span>: <span class="function">(<span class="params">result</span>) =&gt;</span> &#123;</span><br><span class="line">      <span class="built_in">console</span>.log(<span class="string">&#x27;ok&#x27;</span>)</span><br><span class="line">      that.onLoad(that.data.option)</span><br><span class="line">    &#125;,</span><br><span class="line">  &#125;)</span><br><span class="line">&#125;,</span><br><span class="line"><span class="comment">/**回复 */</span></span><br><span class="line"><span class="attr">huifu</span>:<span class="function"><span class="keyword">function</span>(<span class="params">e</span>)</span>&#123;</span><br><span class="line">  <span class="keyword">var</span> replyid=e.currentTarget.dataset.replyid</span><br><span class="line"> <span class="built_in">console</span>.log(replyid)</span><br><span class="line"><span class="built_in">this</span>.setData(&#123;<span class="attr">tolk</span>:<span class="string">&quot;回复：多啦的碑文&quot;</span>,<span class="attr">depth</span>:<span class="number">2</span>,<span class="attr">reply</span>:replyid&#125;)</span><br><span class="line"></span><br><span class="line">&#125;,</span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 生命周期函数--监听页面隐藏</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onHide</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 生命周期函数--监听页面卸载</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onUnload</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 页面相关事件处理函数--监听用户下拉动作</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onPullDownRefresh</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 页面上拉触底事件的处理函数</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onReachBottom</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;,</span><br><span class="line"></span><br><span class="line">  <span class="comment">/**</span></span><br><span class="line"><span class="comment">   * 用户点击右上角分享</span></span><br><span class="line"><span class="comment">   */</span></span><br><span class="line">  <span class="attr">onShareAppMessage</span>: <span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>&#123;</span><br><span class="line"></span><br><span class="line">  &#125;</span><br><span class="line">&#125;)</span><br></pre></td></tr></table></figure>
<h2 id="用户认证"><a href="#用户认证" class="headerlink" title="用户认证"></a>用户认证</h2></li>
</ul>
<p>使用请求头将token传递过去</p>
<blockquote>
<p>header{<br>Authorization<br>}  </p>
</blockquote>
<p>然后get请求里使用  </p>
<blockquote>
<p>token=request.META.get(‘HTTP_AUTHORIZATION’,None)</p>
</blockquote>
<p>None所在的参数是如果没有取到token就为空，或者可以不用设为nONE,设置为其他的字符</p>
<h2 id="自定义认证组件"><a href="#自定义认证组件" class="headerlink" title="自定义认证组件"></a>自定义认证组件</h2><p>在app下新建 author.py</p>
<p>然后</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">from</span> rest_framework.authentication <span class="keyword">import</span> BaseAuthentication</span><br><span class="line"><span class="keyword">from</span> .models <span class="keyword">import</span> UserInfo</span><br><span class="line"><span class="keyword">import</span> models</span><br><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">GeneralAuthentication</span>(<span class="params">BaseAuthentication</span>):</span></span><br><span class="line">    <span class="string">&quot;&quot;&quot;</span></span><br><span class="line"><span class="string">    通用认证，如果成功返回数据，不成功不处理，交给下一组件处理</span></span><br><span class="line"><span class="string">    &quot;&quot;&quot;</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">authenticate</span>(<span class="params">self, request</span>):</span></span><br><span class="line">        token=request.META.get(<span class="string">&#x27;HTTP_AUTHORIZATION&#x27;</span>,<span class="literal">None</span>)</span><br><span class="line">        <span class="keyword">if</span> <span class="keyword">not</span> token:</span><br><span class="line">            <span class="keyword">return</span> <span class="literal">None</span></span><br><span class="line">        user_object=models.UserInfo.objects.<span class="built_in">filter</span>(token=token).first()</span><br><span class="line">        <span class="keyword">if</span> <span class="keyword">not</span> user_object:</span><br><span class="line">            <span class="keyword">return</span> <span class="literal">None</span></span><br><span class="line">        <span class="comment">#成功</span></span><br><span class="line">        <span class="keyword">return</span> (user_object,token)</span><br></pre></td></tr></table></figure>
<p>在seetings.py中设置</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">REST_FRAMEWORK=&#123;</span><br><span class="line">    <span class="string">&quot;UNAUTHENTICATED_USER&quot;</span>:<span class="literal">None</span>,</span><br><span class="line">    <span class="string">&quot;UNAUTHENTICATED_TOKEN&quot;</span>:<span class="literal">None</span></span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>然后在需要认证的接口视图中添加</p>
<blockquote>
<p>  authentication_classes = [GeneralAuthentication,]</p>
</blockquote>
<p>使用<br>在请求方式里面<br>request.user<br>request.token</p>
<ul>
<li><p>设置成全局的认证 在settings.py中添加默认的认证类，</p>
<blockquote>
<p>REST_FRAMEWORK={<br>  “DEFAULT_AUTHENTICATION_CLASS”:[‘app03.author.GeneralAuthentication’,],<br>  “UNAUTHENTICATED_USER”:None,<br>  “UNAUTHENTICATED_TOKEN”:None<br>}</p>
</blockquote>
</li>
<li><p>用户的认证–&gt;登录认证</p>
<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">UserAuthentication</span>(<span class="params">BaseAuthentication</span>):</span></span><br><span class="line">    <span class="string">&quot;&quot;&quot;</span></span><br><span class="line"><span class="string">    用户认证，如果成功返回数据，不成功抛异常</span></span><br><span class="line"><span class="string">    &quot;&quot;&quot;</span></span><br><span class="line">    <span class="function"><span class="keyword">def</span> <span class="title">authenticate</span>(<span class="params">self, request</span>):</span></span><br><span class="line">        token=request.META.get(<span class="string">&#x27;HTTP_AUTHORIZATION&#x27;</span>,<span class="literal">None</span>)</span><br><span class="line">        <span class="keyword">if</span> <span class="keyword">not</span> token:</span><br><span class="line">            <span class="keyword">raise</span> exceptions.AuthenticationFailed()<span class="comment">#返回403</span></span><br><span class="line">        user_object=models.UserInfo.objects.<span class="built_in">filter</span>(token=token).first()</span><br><span class="line">        <span class="keyword">if</span> <span class="keyword">not</span> user_object:</span><br><span class="line">            <span class="keyword">raise</span> exceptions.AuthenticationFailed()<span class="comment">#返回403</span></span><br><span class="line">        <span class="comment">#成功</span></span><br><span class="line">        <span class="keyword">return</span> (user_object,token)</span><br></pre></td></tr></table></figure></li>
</ul>
<p>使用</p>
<ul>
<li>判断是post</li>
<li>然后在使用该认证类<br>在视图函数中<figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">if</span> self.request.method==<span class="string">&#x27;POST&#x27;</span>:</span><br><span class="line">          <span class="keyword">return</span> [UserAuthentication(),]</span><br><span class="line">      <span class="keyword">return</span> [GeneralAuthentication(),]</span><br><span class="line">        </span><br></pre></td></tr></table></figure></li>
</ul>
<h2 id="自定义tabbar"><a href="#自定义tabbar" class="headerlink" title="自定义tabbar"></a>自定义tabbar</h2><ul>
<li><p>步骤1<br>导入官方文档里的自定义tabbar案例,导入到compononts/tabbar中</p>
<ul>
<li>js<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> app=getApp()</span><br><span class="line">Component(&#123;</span><br><span class="line">  <span class="attr">properties</span>:&#123;</span><br><span class="line">    <span class="attr">selected</span>: &#123;</span><br><span class="line">      <span class="attr">type</span>:<span class="built_in">Number</span>,</span><br><span class="line">      <span class="attr">value</span>:<span class="number">0</span></span><br><span class="line">    &#125;</span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="attr">data</span>: &#123;</span><br><span class="line">   </span><br><span class="line">    <span class="attr">color</span>: <span class="string">&quot;#7A7E83&quot;</span>,</span><br><span class="line">    <span class="attr">selectedColor</span>: <span class="string">&quot;#3cc51f&quot;</span>,</span><br><span class="line">    <span class="attr">list</span>: [</span><br><span class="line">     &#123;</span><br><span class="line">      <span class="attr">pagePath</span>: <span class="string">&quot;/pages/news/news&quot;</span>,</span><br><span class="line">      <span class="comment">//iconPath: &quot;/image/icon_component.png&quot;,</span></span><br><span class="line">      <span class="comment">//selectedIconPath: &quot;/image/icon_component_HL.png&quot;,</span></span><br><span class="line">      <span class="attr">text</span>: <span class="string">&quot;首页&quot;</span></span><br><span class="line">    &#125;, &#123;</span><br><span class="line">     </span><br><span class="line">      <span class="attr">text</span>: <span class="string">&quot;发布&quot;</span></span><br><span class="line">    &#125;, &#123;</span><br><span class="line">      <span class="attr">pagePath</span>: <span class="string">&quot;/pages/main/main&quot;</span>,</span><br><span class="line">      <span class="comment">//iconPath: &quot;/image/icon_component.png&quot;,</span></span><br><span class="line">      <span class="comment">//selectedIconPath: &quot;/image/icon_component_HL.png&quot;,</span></span><br><span class="line">      <span class="attr">text</span>: <span class="string">&quot;我的&quot;</span></span><br><span class="line">    &#125;,]</span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="function"><span class="title">attached</span>(<span class="params"></span>)</span> &#123;</span><br><span class="line">  &#125;,</span><br><span class="line">  <span class="attr">methods</span>: &#123;</span><br><span class="line">    <span class="function"><span class="title">switchTab</span>(<span class="params">e</span>)</span> &#123;</span><br><span class="line">      <span class="keyword">const</span> data = e.currentTarget.dataset</span><br><span class="line">      <span class="keyword">const</span> url = data.path</span><br><span class="line">      <span class="keyword">if</span>(url)&#123;</span><br><span class="line">        wx.switchTab(&#123;url&#125;)</span><br><span class="line">      &#125;</span><br><span class="line">      <span class="keyword">else</span>&#123;</span><br><span class="line">      <span class="keyword">if</span>(app.globalData.UserInfo)&#123;</span><br><span class="line">        wx.switchTab(&#123;</span><br><span class="line">          <span class="attr">url</span>: <span class="string">&#x27;/pages/publish/publish&#x27;</span>,</span><br><span class="line">        &#125;)&#125;</span><br><span class="line">        <span class="keyword">else</span>&#123;</span><br><span class="line">          wx.navigateTo(&#123;</span><br><span class="line">            <span class="attr">url</span>: <span class="string">&#x27;/pages/home/home&#x27;</span>,</span><br><span class="line">          &#125;)</span><br><span class="line">         </span><br><span class="line">        &#125;</span><br><span class="line">      &#125;</span><br><span class="line"></span><br><span class="line">    &#125;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;)</span><br></pre></td></tr></table></figure>
需要注意 wx.switchTab()跳转的是tababr页面<br>wx.navigateTo()是非tabbar页面</li>
</ul>
</li>
<li><p>wsml</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">cover-view</span> <span class="attr">class</span>=<span class="string">&quot;tab-bar&quot;</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">cover-view</span> <span class="attr">class</span>=<span class="string">&quot;tab-bar-border&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">cover-view</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">cover-view</span> <span class="attr">wx:for</span>=<span class="string">&quot;&#123;&#123;list&#125;&#125;&quot;</span> <span class="attr">wx:key</span>=<span class="string">&quot;index&quot;</span> <span class="attr">class</span>=<span class="string">&quot;tab-bar-item&quot;</span> <span class="attr">data-path</span>=<span class="string">&quot;&#123;&#123;item.pagePath&#125;&#125;&quot;</span> <span class="attr">data-index</span>=<span class="string">&quot;&#123;&#123;index&#125;&#125;&quot;</span> <span class="attr">bindtap</span>=<span class="string">&quot;switchTab&quot;</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">block</span> <span class="attr">wx:if</span>=<span class="string">&quot;&#123;&#123;item.text==&#x27;发布&#x27;&#125;&#125;&quot;</span> &gt;</span></span><br><span class="line">      </span><br><span class="line">    <span class="tag">&lt;<span class="name">cover-view</span> <span class="attr">class</span>=<span class="string">&quot;pub&quot;</span> <span class="attr">style</span>=<span class="string">&quot;color: &#123;&#123;selected === index ? selectedColor : color&#125;&#125;&quot;</span>&gt;</span>&#123;&#123;item.text&#125;&#125;<span class="tag">&lt;/<span class="name">cover-view</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;/<span class="name">block</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;<span class="name">block</span> <span class="attr">wx:else</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">cover-image</span> <span class="attr">src</span>=<span class="string">&quot;&#123;&#123;selected === index ? item.selectedIconPath : item.iconPath&#125;&#125;&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">cover-image</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">cover-view</span> <span class="attr">style</span>=<span class="string">&quot;color: &#123;&#123;selected === index ? selectedColor : color&#125;&#125;&quot;</span>&gt;</span>&#123;&#123;item.text&#125;&#125;<span class="tag">&lt;/<span class="name">cover-view</span>&gt;</span></span><br><span class="line">  <span class="tag">&lt;/<span class="name">block</span>&gt;</span></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="tag">&lt;/<span class="name">cover-view</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">cover-view</span>&gt;</span></span><br></pre></td></tr></table></figure></li>
<li><p>json</p>
<blockquote>
<p>{<br>“component”: true<br>}</p>
</blockquote>
</li>
<li><p>css</p>
<figure class="highlight css"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br></pre></td><td class="code"><pre><span class="line"><span class="selector-class">.tab-bar</span> &#123;</span><br><span class="line">  <span class="attribute">position</span>: fixed;</span><br><span class="line">  <span class="attribute">bottom</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">left</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">right</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">48px</span>;</span><br><span class="line">  <span class="attribute">background</span>: white;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">padding-bottom</span>: <span class="built_in">env</span>(safe-area-inset-bottom);</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.tab-bar-border</span> &#123;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0.33</span>);</span><br><span class="line">  <span class="attribute">position</span>: absolute;</span><br><span class="line">  <span class="attribute">left</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">1px</span>;</span><br><span class="line">  <span class="attribute">transform</span>: <span class="built_in">scaleY</span>(<span class="number">0.5</span>);</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.tab-bar-item</span> &#123;</span><br><span class="line">  <span class="attribute">flex</span>: <span class="number">1</span>;</span><br><span class="line">  <span class="attribute">text-align</span>: center;</span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">justify-content</span>: center;</span><br><span class="line">  <span class="attribute">align-items</span>: center;</span><br><span class="line">  <span class="attribute">flex-direction</span>: column;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.tab-bar-item</span> cover-image &#123;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">27px</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">27px</span>;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.tab-bar-item</span> cover-view &#123;</span><br><span class="line">  <span class="attribute">font-size</span>: <span class="number">10px</span>;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.pub</span>&#123;</span><br><span class="line">  <span class="attribute">background-color</span>: <span class="number">#d39a32</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">80</span>rpx;</span><br><span class="line">  <span class="attribute">width</span>: <span class="number">80</span>rpx;</span><br><span class="line">  <span class="attribute">border-radius</span>: <span class="number">50%</span>;</span><br><span class="line"></span><br><span class="line">  <span class="attribute">display</span>: flex;</span><br><span class="line">  <span class="attribute">flex-direction</span>: row;</span><br><span class="line">  <span class="attribute">justify-content</span>: center;</span><br><span class="line">  <span class="attribute">align-items</span>: center;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure></li>
<li><p>第2步骤<br>导入使用</p>
</li>
<li><p>json</p>
<figure class="highlight json"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&quot;usingComponents&quot;</span>: &#123;</span><br><span class="line">    <span class="attr">&quot;tabbar&quot;</span>:<span class="string">&quot;/components/tabbar/tabbar&quot;</span></span><br><span class="line">  &#125;,</span><br></pre></td></tr></table></figure></li>
<li><p>wxml</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">tabbar</span> <span class="attr">selected</span>=<span class="string">&quot;&#123;&#123;0&#125;&#125;&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">tabbar</span>&gt;</span></span><br></pre></td></tr></table></figure>
<p>注意 selested里面的值是锁引值，数据是第几个，点击后会变色</p>
</li>
</ul>
<h2 id="在序列化类里获取request"><a href="#在序列化类里获取request" class="headerlink" title="在序列化类里获取request"></a>在序列化类里获取request</h2><figure class="highlight python"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">xx=serlizers.serlizerMtthod()</span><br><span class="line"><span class="function"><span class="keyword">def</span> <span class="title">get_xx</span>(<span class="params">self</span>):</span></span><br><span class="line">request=self.context[<span class="string">&#x27;request&#x27;</span>]</span><br></pre></td></tr></table></figure>

<h1 id="支付"><a href="#支付" class="headerlink" title="支付"></a>支付</h1><p>1.沙箱环境<br>微信里没有<br>2.微信小程序支付<br> 2.1微信支付平台    </p>
<ul>
<li>个人 </li>
<li>企业</li>
</ul>
<p> 2.2商户平台（企业）</p>
<hr>
<p>暂时跳过</p>
<h1 id="celery"><a href="#celery" class="headerlink" title="celery"></a>celery</h1><p>处理任务的的python模块 </p>
<ul>
<li><p>场景1：<br>对于耗时的任务，将任务添加到broker（队列中），然后立即给用户一个任务id，当任务添加到broker之后，由worker去broker获取并处理任务<br>任务完成后，再将结果放到backend中<br>用户想要检查结果，提供任务id，我们可以去backen中去帮他查找。</p>
</li>
<li><p>场景2：<br>定时任务：定时发布，定时拍卖</p>
</li>
</ul>
<p>celery是一个基于python开发的模块，可以对任务进行分发和处理</p>
<ul>
<li>安装（注意版本的区别）<ul>
<li><blockquote>
<p>pip3 install celery</p>
</blockquote>
</li>
<li><blockquote>
<p>安装broker需要redis（已经安装）或者 rabbitMQ</p>
</blockquote>
</li>
<li><blockquote>
<p>pip3 install redis/pika</p>
</blockquote>
</li>
<li><blockquote>
<p>windows 需要另外安装</p>
</blockquote>
</li>
</ul>
</li>
</ul>
<p>使用，参考网上教程</p>
<h2 id="django-celery"><a href="#django-celery" class="headerlink" title="django-celery"></a>django-celery</h2><p>为了使用jango和celery结合起来，使用jango-celery模块</p>
<ul>
<li>安装</li>
<li>在seetings。py中配置</li>
</ul>
<h2 id="https证书申请"><a href="#https证书申请" class="headerlink" title="https证书申请"></a>https证书申请</h2><ul>
<li>阿里云 免费个人 ssl 下载</li>
</ul>
<h2 id="项目部署"><a href="#项目部署" class="headerlink" title="项目部署"></a>项目部署</h2><p>找一台云服务器 安装nginx</p>
<blockquote>
<p>yum install nginx -y</p>
</blockquote>

      
    </div>

    
    
    
      <footer class="post-footer">
        <div class="post-eof"></div>
      </footer>
  </article>
  
  
  


  



          </div>
          

<script>
  window.addEventListener('tabs:register', () => {
    let { activeClass } = CONFIG.comments;
    if (CONFIG.comments.storage) {
      activeClass = localStorage.getItem('comments_active') || activeClass;
    }
    if (activeClass) {
      let activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`);
      if (activeTab) {
        activeTab.click();
      }
    }
  });
  if (CONFIG.comments.storage) {
    window.addEventListener('tabs:click', event => {
      if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return;
      let commentClass = event.target.classList[1];
      localStorage.setItem('comments_active', commentClass);
    });
  }
</script>

        </div>
          
  
  <div class="toggle sidebar-toggle">
    <span class="toggle-line toggle-line-first"></span>
    <span class="toggle-line toggle-line-middle"></span>
    <span class="toggle-line toggle-line-last"></span>
  </div>

  <aside class="sidebar">
    <div class="sidebar-inner">

      <ul class="sidebar-nav motion-element">
        <li class="sidebar-nav-toc">
          文章目录
        </li>
        <li class="sidebar-nav-overview">
          站点概览
        </li>
      </ul>

      <!--noindex-->
      <div class="post-toc-wrap sidebar-panel">
      </div>
      <!--/noindex-->

      <div class="site-overview-wrap sidebar-panel">
        <div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person">
    <img class="site-author-image" itemprop="image" alt="小洞洞"
      src="https://img2.baidu.com/it/u=4224154811,71845300&fm=26&fmt=auto&gp=0.jpg">
  <p class="site-author-name" itemprop="name">小洞洞</p>
  <div class="site-description" itemprop="description">欢迎你的到来！</div>
</div>
<div class="site-state-wrap motion-element">
  <nav class="site-state">
      <div class="site-state-item site-state-posts">
          <a href="/git-study/archives/">
        
          <span class="site-state-item-count">2</span>
          <span class="site-state-item-name">日志</span>
        </a>
      </div>
      <div class="site-state-item site-state-categories">
            <a href="/git-study/categories/">
          
        <span class="site-state-item-count">1</span>
        <span class="site-state-item-name">分类</span></a>
      </div>
      <div class="site-state-item site-state-tags">
        <span class="site-state-item-count">2</span>
        <span class="site-state-item-name">标签</span>
      </div>
  </nav>
</div>



      </div>

    </div>
  </aside>
  <div id="sidebar-dimmer"></div>


      </div>
    </main>

    <footer class="footer">
      <div class="footer-inner">
        

        

<div class="copyright">
  
  &copy; 
  <span itemprop="copyrightYear">2021</span>
  <span class="with-love">
    <i class="fa fa-heart"></i>
  </span>
  <span class="author" itemprop="copyrightHolder">小洞洞</span>
</div>
  <div class="powered-by">由 <a href="https://hexo.io/" class="theme-link" rel="noopener" target="_blank">Hexo</a> & <a href="https://mist.theme-next.org/" class="theme-link" rel="noopener" target="_blank">NexT.Mist</a> 强力驱动
  </div>
<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>

<div class="powered-by">
  <i class="fa fa-user-md"></i>
  <span id="busuanzi_container_site_pv">
    本站访问量:<span id="busuanzi_value_site_pv"></span>次
  </span>
  <span class="post-meta-divider">|</span>
  <span id="busuanzi_container_site_uv">
    本站总访客量：<span id="busuanzi_value_site_uv"></span>人
  </span>
</div>



        








      </div>
    </footer>
  </div>

  
  <script src="/git-study/lib/anime.min.js"></script>
  <script src="/git-study/lib/velocity/velocity.min.js"></script>
  <script src="/git-study/lib/velocity/velocity.ui.min.js"></script>

<script src="/git-study/js/utils.js"></script>

<script src="/git-study/js/motion.js"></script>


<script src="/git-study/js/schemes/muse.js"></script>


<script src="/git-study/js/next-boot.js"></script>




  




  
<script src="/git-study/js/local-search.js"></script>













  

  

<script src="/git-study/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"model":{"jsonPath":"/git-study/live2dw/assets/shizuku.model.json"},"display":{"position":"right","width":70,"height":120},"mobile":{"show":true},"log":false,"pluginJsPath":"lib/","pluginModelPath":"assets/","pluginRootPath":"live2dw/","tagMode":false});</script></body>
</html>
<script type="text/javascript" src="//cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js"></script>
<!-- ҳ����С���� -->
<script type="text/javascript" src="/js/clicklove.js"></script>

